Final
Source code:
Copy codeThe Code is as follows:
<Html>
<Head>
<Meta http-equiv = "content-type" content = "text/html; charset = gb2312">
<Script src = "http://demo.jb51.net/jslib/jquery/jquery.js"> </script>
<Script type = "text/javascript">
Function scroll_news (){
Var $ firstNode = $ ('# scroll-container li ');
// Obtain the number of columns of the I value
Var iRow = $ ('# scroll-iner'). find ('lil'). length-1;
// Debugger;
$ (Function (){
$ FirstNode. eq (0). fadeOut ('low', function (){
$ (This). clone (). appendTo ($ (this). parent (). fadeIn ('low ');
$ (This). remove ();
$ FirstNode. eq (iRow). hide ();
});
});
}
$ (Document). ready (function (){
Go ();
});
Function stop (){
ClearInterval (sn );
}
Function go (){
Sn = setInterval ('scroll _ news () ', 2000 );
}
</Script>
<Style type = "text/css">
# Scroll-container {border: 1px #000 solid; background: # FEC; height: 23px; line-height: 23px ;}
# Scroll-container li {list-style: none; display: none; font-size: 12px ;}
Li a {color: # F00; text-decoration: none; margin-left: 10px ;}
Li a: hover {text-decoration: underline ;}
</Style>
</Head>
<Body>
<Div id = "scroll-container" onMouseOver = "stop ();" onMouseOut = "go ();">
<Li> <a href = "#"> once in a lifetime </a> </li>
<Li> <a href = "#"> do not bow down because you are willful </a> </li>
<Li> <a href = "#"> do not break up with stubbornness </a> </li>
<Li> <a href = "#"> believe it once </a> </li>
<Li> <a href = "#"> one heart needs to warm another heart firmly </a> </li>
<Li> <a href = "#"> keep going </a> </li>
<Li> <a href = "#"> white-headed </a> </li>
<Li> <a href = "#"> in that way </a> </li>
<Li> <a href = "#"> in the current year </a> </li>
<Li> <a href = "#"> years of Well-Being </a> </li>
<Li> <a href = "#"> wishing this life </a> </li>
<Li> <a href = "#"> shouzi </a> </li>
<Li> <a href = "#"> and zi </a> </li>
</Div>
</Body>
</Html>