jQuery plugins - jQuery News Ticker
nov 23

jQuery News Ticker

Hírfolyam váltakozó üzenetekből

Verzió: 1.8
Kiadás dátuma: 2011/11/13
Fejlesztő: Rhodri George
Liszensz: GPL v2

Bevezető

Az előző plugin (List Ticker) egy egyszerű lista elemeit jelenítette meg váltakozva. Ez a plugin ugyan ebből az alapötletből építkezik, csak egy kicsit tovább fejlesztve azt: képes ajax segítségével XML file-okból beolvasni a kívánt tartalmat, illetve a rendelkezésre álló opciók is többféle beállítási lehetőséget kínálnak, mint pl. a vezérlőelemek megjelenítése a hírsávban.

Implementálás

CSS

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

JavaScript

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

Deklaráció

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

Használat

            <ul id="pelda" class="js-hidden">
              <li class="news-item"><a href="#">Első elem</a></li>
              <li class="news-item"><a href="#">Második elem</a></li>
              <li class="news-item"><a href="#">Harmadik elem</a></li>
              ...
            </ul>
          

Teljes paraméterlista

  • speed: az egyes elemek megjelenítésének sebessége (alapértelmezett: 0.1)
  • ajaxFeed: a megjelenítendő tartalom betöltése ajax-szal (true | false) (alapértelmezett: false)
  • feedUrl: az ajaxFeed paraméter használatához a "feed" elérési útja (true | false)
    (alapértelmezett: false)
  • feedType: a tartalom típusa - jelenleg csak az XML érhető el (alapértelmezett: 'xml')
  • htmlFeed: HTML alapú tartalmak használatának engedélyezése/tiltása (true | false) (alapértelmezett: true)
  • debugMode: hibaellenőrző mód engedélyezése/tiltása - segítségével a console-ban (Firebug) hasznos, a hibák felderítésére szolgáló hibaüzeneteket jeleníthetünk meg (true | false) (alapértelmezett: true)
  • controls: vezérlő gombok engedélyezése/tiltása (true | false) (alapértelmezett: true)
  • titleText: cím használata a plugin-hoz (alapértelmezett: 'Latest')
  • displayType: a megjelenítéshez használt animáció típusa ('reveal' | 'fade') (alapértelmezett: 'reveal')
  • direction: a kiiratás iránya ('ltr' | 'rtl') (alapértelmezett: 'ltr')
  • pauseOnItems: az egyes tartalmak megjelenítésének időtartama milliszekundumban (alapértelmezett: 2000)
  • fadeInSpeed: a fadeIn animáció sebessége (alapértelmezett: 600)
  • fadeOutSpeed: a fadeOut animáció sebessége (alapértelmezett: 300)