2008-09-03 11 views
5

Estoy buscando un poco de JQuery o JS que me permita producir una lista de "ticker de noticias" de desplazamiento horizontal.¿Qué es una buena cantidad de JS o JQuery para el ticker de noticias de desplazamiento horizontal?

El HTML producido debe cumplir con los estándares también.

He intentado liScroll pero esto tiene la costumbre de romperse (algunos contenidos terminan en una segunda línea al comienzo del desplazamiento), especialmente con listas más largas.

También he intentado this News Ticker pero cuando se incluye un DOCTYPE, el desplazamiento se sacudirá en lugar de circular suavemente al final de cada ciclo.

Cualquier sugerencia es apreciada.

Editar

Así que gracias a la sugerencia de Matt Hinze me di cuenta de que podía hacer lo que quería hacer con jQuery animar (I requieren desplazamiento continuo sin desplazamiento discreto como el ejemplo). Sin embargo, rápidamente encontré problemas similares a los que tenía con liScroll y, después de todo, me di cuenta de que un problema de CSS (como siempre) era responsable.

Solución: liScroll - cambie el valor predeterminado 'var stripWidth = 0' a algo así como 100, para dar un poco de espacio y evitar el nuevo ajuste de línea.

Respuesta

5

Smooth Div de desplazamiento también se puede utilizar como una barra de noticias/tablero de cotizaciones. Puede detenerse con el mouse sobre el mouse o hacia abajo y puede repetirse sin interrupción si así lo desea.

Aquí está el ejemplo con un ticker ejecutando: http://www.maaki.com/

+0

Vaya que parece grande. –

0

Una solución alternativa sería también el jQuery webTicker; es muy similar a liscroll; sin embargo, resuelve el problema con la parada del ticker una vez completada la lista completa; mientras que también agrega algunas nuevas características de lujo como; dirección de movimiento; velocidad; y capacidad de usar múltiples tickers por página.

0

El segundo error de línea que surge en liscroll puede ser "fijo" mediante la adición de un listitem que contiene un espacio entitiy no rompible <li>&nbsp;</li> al final de cada lista;)

Cuestiones relacionadas