向上滚动


<!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>
<style>
a{display:block;font-size:15px;line-height:18px;text-decoration:none;color:#333;font-family:Arial;font-size:12px;}
.shell{
background:url(http://bbs.blueidea.com/images/common/xml.gif) no-repeat 4px 5px;
border:1px solid #aaa;
width:400px;
padding:3px 2px 2px 20px;
}
#div1{
height:18px;
overflow:hidden;
}
#div1 a{float:left; margin-right:20px;}
</style>
</head>

<body>
<div class="shell">
<div id="div1">
<a href="javascript:">单行文字向上滚动特效兼容多种浏览器</a>
<a href="javascript:">单行文字向上滚动特效兼容</a>
<a href="javascript:">文字向上滚动特效兼容多种浏览器</a>
<a href="javascript:">文字向上滚动兼容各种浏览器</a>
<a href="javascript:">非常好的文字向上滚动代码</a>
<a href="javascript:">单行文字向上滚动特效兼容多种浏览器</a>
<a href="javascript:">单行文字向上滚动特效兼容2010-10-10</a>
</div>
</div>
<script>
var box=document.getElementById("div1"),can=true;
box.innerHTML+=box.innerHTML;
box.onmouseover=function(){can=false};
box.onmouseout=function(){can=true};
new function (){
var stop=box.scrollTop%18==0&&!can;
if(!stop)box.scrollTop==parseInt(box.scrollHeight/2)?box.scrollTop=0:box.scrollTop++;
setTimeout(arguments.callee,box.scrollTop%18?10:1500);
};
</script>
</body>
</html>

 

 

http://hi.baidu.com/yangwenguan/blog/item/2c3b863d763edf0fbba16789.html

posted on 2010-11-18 21:48  菜鸟级  阅读(491)  评论(0编辑  收藏  举报

导航