JS公告上滾代碼,非常簡單
//下面是JS文件,用到了jquery,Html代碼如下,你可以copy下來就可以用了。
<! DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd"> <html XMLns="http://www.w3.org/1999/xhtml"> <head> <meta http-equiv="Content-Type" content="text/Html; charset=utf-8" /> <title>公告上滾動代碼 </title> <script type="text/Javascript" src="http://www.jqueryAJax.com/jquery-1.3.2.min.JS"></script> <script type='text/Javascript'> //滾動公 告 function AutoScroll(obj){ $(obj).find("ul:first").animate({ marginTop:"-25px" },500,function(){ $(this).css({marginTop:"0px"}).find("li:first").appendTo (this); }); } var s = true; var t=0; function startli() { if(s) t = setInterval('AutoScroll(".scrollDiv")',2000); } //suggest $(document).ready(function(){ //滾動公告 startli(); $(".scrollDiv").hover(function(){ clearInterval(t); var s = false; },function(){ s = true; startli(); }); }) </script> <style type="text/CSS"> .scrollDiv{border:1px #ccc solid; width:150px; height:25px; overflow:hidden} .scrollDiv ul{height:25px; line-height:25px; margin:0; padding:0;} .scrollDiv li{line-height:25px; padding-left:5px; height:25px; overflow:hidden} </style> </head> <body> <div class="scrollDiv"> <ul> <li><a href="htp://www.jqueryajax.com">滾動公告一 </a></li> <li><a href="htp://www.jqueryajax.com">滾動公告二</a></li> <li><a href="htp://www.jqueryajax.com">滾動公告三 </a></li> <li><a href="htp://www.jqueryajax.com">滾動公告四</a></li> <li><a href="htp://www.jqueryajax.com">滾動公告五 </a></li> <li><a href="htp://www.jqueryAJax.com">滾動公告六 </a></li> </ul> </div> </body> </Html>