这个间歇性向上滚动js代码很适合做广告展示,友情链接等等。
与平常的无缝向上连续滚动不同的是它每滚动一个就会停顿一会儿。
<!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=gb2312" /> <title>符合标准的间歇向上翻滚代码 - 中国asp之家</title> <style type="text/css"> body { color:#000; font-size:12px; margin:0 auto; padding:0; } FORM { MARGIN: 0px; padding:0px; } .brandAll ul { margin:0; padding:0; } .brandMain{ MARGIN: 0px; WIDTH:468px; background:#ffffff; padding:0px; border:1px solid #A9D390; clear:both; } .brandAll{ WIDTH: 468px; margin: 0px; padding: 0px; } .brandAll li { width:100%; height:30px; margin:0px; padding: 0px;list-style:none; float:left; } .b1{ background-color: #FAF0DE; } .brandAll img { } </style> </head> <body> <script language="JavaScript"> var obj_marquee; var marquee_spd = 4000; var step_c = 0; function marquee_init() { obj_marquee = document.getElementById("marquee"); var obj_unit = obj_marquee.firstChild; var n = Math.ceil(parseInt(obj_marquee.style.height) / obj_unit.offsetHeight); for(var i=0; i<n; i++) obj_marquee.appendChild(obj_unit.cloneNode(true)); setInterval("step_c=0;setTimeout('marquee_show()',30)", marquee_spd); return; } function marquee_show() { var marquee_high = parseInt(obj_marquee.style.height); var step = marquee_high/60; if(obj_marquee.scrollTop >= obj_marquee.children[1].offsetTop) { obj_marquee.scrollTop = 0; marquee_show(); return; } obj_marquee.scrollTop += step; if(step_c++ < 60) setTimeout("marquee_show()", 30); return; } window.onload=marquee_init; </script> <div class="brandMain"> <div id="marquee" class="brandAll" style="overflow:hidden;height:60px;width:468px;border:0px;padding:0px;"> <div style="border:0px;padding:0px"> <!-- Marquee Body Head --> <div style="height:60px;" class="brandAll"><ul> <li class="b1"><a href="http://www.aspxhome.com/" target="_blank">中国asp之家 </a></li> <li class="b1"><a href="http://www.aspxhome.com/" target="_blank">间歇向上翻滚代码 </a></li> <li class="b1"><a href="http://www.aspxhome.com/" target="_blank">js间歇向上翻滚特效 </a></li> <li class="b1"><a href="http://www.aspxhome.com/" target="_blank">中国asp之家 </a></li> <li class="b1"><a href="http://www.aspxhome.com/" target="_blank">欢迎光临! </a></li> <li class="b1"><a href="http://www.aspxhome.com/" target="_blank">中国asp之家 </a></li> <li class="b1"><a href="http://www.aspxhome.com/" target="_blank">中国asp之家 </a></li> <li class="b1"><a href="http://www.aspxhome.com/javascript/" target="_blank">Javascript</a></li> </ul></div> <!-- Marquee Body Bottom --> </div> </div> </div> </body> </html> [提示:你可先修改部分代码,再按运行]