MooTools News Ticker

Css

#news_ticker{position:relative; height:20px; overflow:hidden;}
#news_ticker li {position:absolute; left:0; top:40px; z-index:2; display:block; list-style-type:none;}

Html

<ul id=news_ticker>
<li><a href='#'>news ticker text one</a></li>
<li><a href='#'>news ticker text two</a></li>
<li><a href='#'>news ticker text three</a></li>
<li><a href='#'>news ticker text four</a></li>
<ul>

MooTools

window.addEvent(domready, function(){
var x=0;
var li=$(news_ticker).getElements(li);
li.each(function(el,i){el.setStyle(top,[i<1?0:40]);});
function action() {
li[x].get(tween, {property: top, duration: long}).start(40);
li[x=x<li.length-1?x+1:0].get(tween, {property: top, duration: long}).start(0);
}
action.periodical(2000);
});