jQuery plugins - jTicker
jún 06

jTicker

Gépelés effekt

Verzió: 0.9.1 beta
Kiadás dátuma: nincs adat
Fejlesztő: Stephen Band
Liszensz: nincs adat

Bevezető

A jTicker segítségével olyan hatást érhetünk el, mintha épp akkor gépelnénk be egy adott szövegblokkot. Paraméterek segítségével szabályozhatjuk az animáció sebességét, valamint a gépelés effekthez tartozó kurzor képét is testreszabhatjuk.

A plugin működése egyszerű: a plugin végig lépked a hivatkozott blokk gyerek elemein és azokat egyenként beolvasva karakterenként jeleníti meg a képernyőn. Ebből következik, hogy ha egyszerre több HTML elemet szeretnénk megjeleníteni (pl. H2 cím, egy bekezdés és egy lista), akkor azokat egy külön blokkba (pl. div vagy span) kell ágyazni.

Implementálás

JavaScript

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

Deklaráció

            $(document).ready(function(){
              $('#pelda').ticker().trigger('play');
            }); 
          

Teljes paraméterlista

  • rate: az animáció sebessége (alapértelmezett: 40)
  • delay: két egymást követő egység közti szünet milliszekundumban (alapértelmezett: 2000)
  • cursorList: a kurzor testreszabása: ha egy sima sztringet adunk át neki, akkor az adott sztring lesz a kurzor képe, míg ha egy karakterekből (esetleg sztringekből) álló tömböt, akkor a kurzort ezen tömb elemei alkotják váltakozva, ezzel egyedi hatást adva az animációnak (alapértelmezett: "_")
  • cursor: a kurzor HTML kódja (alapértelmezett: jQuery('<span class="cursor" />'))
Metódusok
  • play(): következő elem lejátszása
  • stop(): lejátszás megállítása az aktuális elem végén
  • control(): a plugin beállításainak futás közbeni módosítása, pl. rate paraméter

Tippek

  • Sajnos a plugin-ból egy oldalon csak egy példány implementálható.