jQuery plugins - Tiny Carousel
dec 22

Tiny Carousel

Egyszerű carousel plugin

Verzió: 1.8
Kiadás dátuma: 2010/11/10
Fejlesztő: Maarten Baijs
Liszensz: nincs adat

Bevezető

Egyszerű, könnyedén és viszonylag jól paraméterezhető carousel plugin. Alkalmazhatjuk horizontálisan és vertikálisan egyaránt, meghatározhatjuk a vetítés kezdőképét, használhatunk automatikus lejátszást oda-vissza, testreszabhatjuk az animáció sebességét, stb.

Implementálás

CSS

            <link rel="stylesheet" type="text/css" href="css/style.css" />
          

JavaScript

            <script type="text/javascript" src="js/jquery.js"></script>
            <script type="text/javascript" src="js/jquery.tinycarousel.js"></script>
          

Deklaráció

            $(document).ready(function(){
              $('#pelda').tinycarousel();
            });
          

Használat

A HTML kódnak a következő struktúrát kell követnie:

            <div id="pelda">
              <a class="buttons prev" href="#">előző</a>
              <div class="viewport">
                <ul class="overview">
                  <li><img src="images/img1.jpg" alt="" /></li>
                  <li><img src="images/img2.jpg" alt="" /></li>
                  ...
                </ul>
              </div>
              <a class="buttons next" href="#">következő</a>
            </div>
          

Teljes paraméterlista

  • start: kezdő elem sorszáma (alapértelmezett: 1)
  • display: egyszerre mozgatott elemek száma (alapértelmezett: 1)
  • axis: a slider iránya ('x' | 'y') (alapértelmezett: 'x')
  • controls: az előző/következő navigációs gombok engedélyezése/tiltása (true | false)
    (alapértelmezett: true)
  • pager: lapozó használatának engedélyezése/tiltása (true | false) (alapértelmezett: false)
  • interval: automatikus lejátszás engedélyezése/tiltása (true | false) (alapértelmezett: false)
  • intervaltime: automatikus lejátszás esetén a váltások közti időtartam milliszekundumban (alapértelmezett: 3000)
  • rewind: a lejátszás végéhez érve a visszafelé játszás engedélyezése/tiltása automatikus lejátszás esetén (true | false) (alapértelmezett: false)
  • animation: animáció engedélyezése/tiltása (true | false) (alapértelmezett: true)
  • duration: az animáció időtartama (sebessége) milliszekundumban (alapértelmezett: 1000)
  • callback: függvény meghívása minden váltást követően (alapértelmezett: null)