Js间断/连续的文字滚动代码
-
Js文字滚动代码,可设置间断滚动和连续滚动。滚动时是向上滚动的,控制Li列表滚动,兼容性表现地不错,兼容IE/火狐、Opera等浏览器,代码如下:
01<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN">02<html>03<head>04<title>文字间隔滚动代码-兼容IE和FireFox</title>05<styletype="text/css">06<!--07body {08text-align:center;09}10ul{11margin:0px;12padding:0px;13list-style:none;14}15#andyscroll {16overflow: hidden;17background: #E8F8F8;18padding: 0 10px;19text-align: left;20400px;21height:100px;22overflow:hidden;23}24#andyscroll a {25font:12px/18px tahoma;26color: #000;27float:left;28100%;29text-decoration: none;30display:block;31}32#andyscroll a:hover {33font:12px/18px tahoma;34color: #F60;35}36-->37</style>38</head>39<body>40<divid="andyscroll">41<divid="scrollmessage">42<UL>43<li><ahref="#">完全兼容IE, FF, Opera, 文字间断滚动测试……</a></li>44<li><ahref="#">完全兼容IE, FF, Opera, 文字间断滚动测试……</a></li>45<li><ahref="#">完全兼容IE, FF, Opera, 文字间断滚动测试……</a></li>46<li><ahref="#">完全兼容IE, FF, Opera, 文字间断滚动测试……</a></li>47<li><ahref="#">完全兼容IE, FF, Opera, 其它的还未经测试……</a></li>48<li><ahref="#">完全兼容IE, FF, Opera, 文字间断滚动测试……</a></li>49<li><ahref="#">完全兼容IE, FF, Opera, 其它的还未经测试……</a></li>50<li><ahref="#">完全兼容IE, FF, Opera, 文字间断滚动测试……</a></li>51<ul>52</div>53</div>54<scripttype="text/javascript">55var stopscroll = false;56var scrollElem = document.getElementById("andyscroll");57var marqueesHeight = scrollElem.style.height;58scrollElem.onmouseover = new Function('stopscroll = true');59scrollElem.onmouseout = new Function('stopscroll = false');60var preTop = 0;61var currentTop = 0;62var stoptime = 0;63var leftElem = document.getElementById("scrollmessage");64scrollElem.appendChild(leftElem.cloneNode(true));65init_srolltext();66function init_srolltext(){67scrollElem.scrollTop = 0;68setInterval('scrollUp()', 35);//确定滚动速度的, 数值越小, 速度越快69}70function scrollUp(){71if(stopscroll) return;72currentTop += 1; //设为1, 可以实现间歇式的滚动; 设为2, 则是连续滚动73if(currentTop == 19) {74stoptime += 1;75currentTop -= 1;76if(stoptime == 180) {77currentTop = 0;78stoptime = 0;79}80}else{81preTop = scrollElem.scrollTop;82scrollElem.scrollTop += 1;83if(preTop == scrollElem.scrollTop){84scrollElem.scrollTop = 0;85scrollElem.scrollTop += 1;86}87}88}89</script>90</body>91</html>