I news tickers sono ampiamente usati in molti siti per mostrare contenuti in uno spazio piccolo.

jQuery News Ticker è un plugin jQuery ispirato dal news ticker usato nel sito BBC che si presta a molte personalizzazioni e ad una installazione semplice e veloce.

Può attingere contenuti da una lista ordinata, da un feed RSS o da un semplice file HTML mostrandoli in un’interfaccia semplice e customizzabile.

Sul ticker sono presenti (a destra) dei pulsanti di controllo per scorrere verso destra o sinistra e mettere in pausa lo scorrimento delle news.

E’ possibile personalizzare a vostro piacimento i seguenti effetti:

– la velocità degli effetti
– il tipo di transizione tra una news e l’altra
– direzione di scorrimento (da sinistra a destra o vice-versa)
– la durata di visualizzazione di ogni singola notizia

La caratteristica più allettante a mio avviso è la possibilità di caricare nel ticker un qualsiasi RSS (unica pecca è che al momento il feed deve essere nello stesso dominio del ticker)

Per inserirlo in una pagina la procedura è molto semplice.
Inserite il richiamo al css e al js all’inizio della pagina

<link href="css/ticker-style.css" rel="stylesheet" type="text/css" />
<script src="jquery.ticker.js" type="text/javascript"></script>

A questo punto non vi resta che inserire il ticker con questo codice

<div id="ticker-wrapper" class="no-js">
    <ul id="js-news" class="js-hidden">
        <li class="news-item"><a href="#">Prima notizia</a></li>
        <li class="news-item"><a href="#">Seconda notizia</a></li>
        <li class="news-item"><a href="#">Terza notizia</a></li>
        <li class="news-item"><a href="#">Quarta notizia</a></li>
    </ul>
</div>

E’ possibile scaricare lo script e avere maggiori informazioni sulle personalizzazione qui

Rispondi