Twitter style “News ticker” (jQuery)

Question

I am looking for a news ticker pretty much identical to the one on twitter (the one the scrolls horizontally)

The main things I am looking for:

Continuous scroll
- When an element is no longer visible it is removed and put at the very back of the list.
No Pause
- It should be a smooth scroll, not a scroll, pause, scroll

I attempted to do it by

Setting the ul to overflow: hidden
Animating the li:first using margin-left: {current_margin_left}-10 every second

But it goes way to fast and breaks.

Is there anything that matches this description?

Answer 1

The below link consists of a tutorial to create a pure jQuery & CSS twitter ticker which utilizes Twitter’s Search API. It will show your or your friends’ latest tweets, and will not require any server side code or databases. As a result, the ticker will be easily included into any web page and easily modified to your likings.

Check the below link for detailed info -

http://tutorialzine.com/2009/10/jquery-twitter-ticker/

Answer 2

I think the jQuery webTicker would match your description perfectly; the idea was exactly the Twitter one and it took us some time to develop exactly. It also comes with extras like fade-in and fadeout effects; choice of different directions and speeds and also a customisable stylesheet. An additional plus is you can run multiple tickers per page.

I do hope you find this answer useful.