jQuery plugins - Tab Down
szept 21

Tab Down

Dropdown tartalom

Verzió: 0.1
Kiadás dátuma: 2010/04/02
Fejlesztő: Matt Hobbs
Liszensz: Creative Commons Attribution 2

Bevezető

Biztos már mindenki találkozott azzal, hogy bizonyos része a honlapnak, pl. belépés-, ill. a regisztrációs űrlap, esetleg valamilyen felhívás, hirdetés nem a honlap úgymond szerves része, hanem az oldal tetején egy gombra kattintva csúszik be, illetve egy újabb kattintásra csúszik vissza.

A Tab Down plugin ezt valósítja meg - raádásul a megoldáshoz kétféle lehetőséget is biztosít
(lásd lejjebb: floating paraméter)

Implementálás

JavaScript

A plugin működéséhez szükséges az easing.js plugin is, amely az animációk tárházát sorakoztatja fel számunkra:

            <script type="text/javascript" src="js/jquery.js"></script>
            <script type="text/javascript" src="js/easing.js"></script>
            <script type="text/javascript" src="js/jquery-tab-down-v0.1.js"></script>
          

Deklaráció

            $(document).ready(function(){
              $('#tabContent').tabDown();
            });
          

Használat

A deklaráció során megadott azonosítóval készítsünk egy div blokk-ot a rejtett tartalommal, de ügyeljünk rá, hogy ha külön konténer elemben szeretnénk megjeleníteni, akkor a blokk azon belül helyezkedjen el.

Teljes paraméterlista

  • floating: a legördülő rész viselkedése állítható be vele: a tartalom fölött csússzon-e be, vagy az egész tartalmat tolja le (true | false)
    (alapértelmezett: true)
  • time: az animáció (csúsztatás) időtartama milliszekundumban (alapértelmezett: 1000)
  • container: ha a tab-nak van konténer eleme (wrapper), akkor a helyes működéshez ezt meg kell adnunk a paraméter segítségével (a konténer elem selector-át) a plugin számára
    (alapértelmezett: 'body')
  • downtext: a tab szövege lenyitás előtt (alapértelmezett: 'Down')
  • uptext: a tab szövege lenyitás után (alapértelmezett: 'Up')
  • easing: az animáció típusa (további részleteket a jQuery easing plugin weboldalán találsz)
    (alapértelmezett: 'swing)