码迷,mamicode.com
首页 > Web开发 > 详细

js特效,轻松实现内容的无缝平滑滚动

时间:2014-11-04 13:04:04      阅读:170      评论:0      收藏:0      [点我收藏+]

标签:style   blog   http   io   ar   java   sp   div   on   

<!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>无缝滚动代码示例</title>
<style>
  a{}{display:block;font-size:15px};
</style>
<SCRIPT LANGUAGE="JavaScript">
<!--
function   scrolln(){
objDiv.scrollTop+=1;

if   (objDiv.scrollTop>20)   {
objDiv.scrollTop=0;

do{
var   objChild=objDiv.firstChild;
objDiv.removeChild(objChild);
objDiv.appendChild(objChild);
}while(!objChild.innerHTML)
}
}
   //-->
  </SCRIPT>
  </head>
   <body>
  <div   id="divMain"   style="width:300px;height:68px;overflow:hidden;line-height:20px">
   <a href="http://www.livebaby.cn/blog">《戒子篇》-- 诸葛亮</a><br>
   <a href="http://www.livebaby.cn/blog">夫君子之行,静以修身,俭以养德。</a><br>
   <a href="http://www.livebaby.cn/blog">非澹泊无以明志,非宁静无以致远。</a><br>
   <a href="http://www.livebaby.cn/blog">夫学须静也,才须学也,</a><br>
   <a href="http://www.livebaby.cn/blog">非学无以广才,非志无以成学,</a><br>
  <a href="http://www.livebaby.cn/blog">淫漫则不能励精,险躁则不能治性,</a><br>
   <a href="http://www.livebaby.cn/blog">年与时驰,意与日去,</a><br>
  <a href="http://www.livebaby.cn/blog">遂成枯落,多不接世,</a><br>
   <a href="http://www.livebaby.cn/blog">悲守穷庐,将复何及!</a><br>
   <a href="http://www.livebaby.cn/blog">www.livebaby.cn/blog</a><br>
   </div>
   <div id="divS"></div>
   <script>
   var   tmp=setInterval("scrolln()",100);
   var   objDiv=document.getElementById("divMain");
   objDiv.onmouseover=function(){clearInterval(tmp)}
   objDiv.onmouseout=function(){tmp=setInterval("scrolln()",100)}
   </script>
  </body>
   </html>

js特效,轻松实现内容的无缝平滑滚动

标签:style   blog   http   io   ar   java   sp   div   on   

原文地址:http://www.cnblogs.com/svennee/p/4073101.html

(0)
(0)
   
举报
评论 一句话评论(0
登录后才能评论!
© 2014 mamicode.com 版权所有  联系我们:gaon5@hotmail.com
迷上了代码!