Che cosa è un bel po' di JS o JQuery per il news ticker a scorrimento orizzontale
https://stackoverflow.com/questions/41027
-
09-06-2019 - |
italiano
english
français
española
中国
日本の
العربية
Deutsch
한국어
Português
RussianDomanda
Sto cercando un po' di JQuery o JS che mi permetta di produrre un elenco di "news ticker" a scorrimento orizzontale.
Anche l'HTML prodotto deve essere conforme agli standard.
Ho provato liScroll ma questo ha l'abitudine di rompersi (alcuni contenuti finiscono su una seconda riga all'inizio dello scorrimento), soprattutto con elenchi più lunghi.
Ci ho anche provato questo ticker delle notizie ma quando viene incluso un DOCTYPE, lo scorrimento subirà un sussulto anziché scorrere in modo fluido alla fine di ogni ciclo.
Tutti i suggerimenti sono apprezzati.
Modificare
Quindi, grazie al suggerimento di Matt Hinze, ho capito che potevo fare quello che volevo con JQuery animate (ho bisogno di uno scorrimento continuo e non di uno scorrimento discreto come nell'esempio).Tuttavia, mi sono imbattuto rapidamente in problemi simili a quelli che avevo con liScroll e dopo tutto ho capito che il responsabile era un problema CSS (come sempre).
Soluzione:liScroll - cambia il valore predefinito 'var stripWidth = 0' in qualcosa come 100, per dare un po' di spazio ed evitare il ritorno a capo di una nuova riga.
Soluzione
Smooth Div Scroll può essere utilizzato anche come ticker di notizie/ticker di borsa.Può mettere in pausa il mouse sopra o il mouse giù e può ripetersi all'infinito se lo desideri.
Ecco l'esempio con un ticker corrente.
Altri suggerimenti
Ecco altre 2 soluzioni che sembrano un po' più semplici da implementare:
Una soluzione alternativa sarebbe anche la jQuery webTicker;è molto simile a liscroll tuttavia risolve il problema con l'arresto del ticker dopo il completamento dell'intero elenco;aggiungendo anche alcune nuove funzionalità fantasiose come;direzione del movimento;velocità;e possibilità di utilizzare più ticker per pagina.
Il bug della seconda riga che si verifica in liscroll può essere "risolto" aggiungendo un elemento di elenco contenente un'entità di spazio non separabile <li> </li> alla fine di ogni elenco ;)
