向上逐行滚动JS代码，鼠标划过暂停

最新推荐文章于 2024-09-02 21:53:59 发布

原创最新推荐文章于 2024-09-02 21:53:59 发布 · 3.2k 阅读

0 ·

本内容遵循CC 4.0 BY-SA版权协议

收录于

HTML / CSS / JavaScript

本文介绍了一个使用纯JS实现的向上逐行滚动效果，鼠标划过时滚动暂停。通过修改HTML和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> <title>向上逐行滚动JS代码，鼠标划过暂停-懒人建站</title> <meta http-equiv="Content-Type" content="text/html; charset=utf-8" /> <title>Jquery 特效_JS代码_JS广告代码_下拉菜单代码-懒人建站</title> <meta name="keywords" content="jquery特效,JS代码,js特效代码大全,导航菜单代码,焦点幻灯片, 企业网页设计欣赏" /> <meta name="description" content="懒人建站为您提供-基于jquery特效，jquery弹出层效果，js特效代码大全，JS广告代码，导航菜单代码，下拉菜单代码和jquery焦点图片代码。" /> <meta http-equiv="content-type" content="text/html;charset=gb2312"> <style type="text/css"> a{ display:block;/*这个属性是必须的*/ font-size:12px; line-height:18px; text-decoration:none; color:#333; font-family:Arial; } .shell{ border:1px solid #aaa; width:400px; padding:3px 2px 2px 20px; } #div1{ height:18px; overflow:hidden; } </style> </head> <body> <div class="shell"> <div id="div1"> <a href="javascript:" mce_href="javascript:">请教高手帮我看下这段代码：FLASH显示不了</a> <a href="javascript:" mce_href="javascript:">请教在UTF-8编辑下的符号显示问题</a> <a href="javascript:" mce_href="javascript:">jquery做的一个滑动效果，不知如何增加延迟，现在太灵敏了</a> <a href="javascript:" mce_href="javascript:">技术研究：QQ2009版按钮渐显渐隐的由来</a> <a href="javascript:" mce_href="javascript:">Javascript读取Json数据并分页显示，支持键盘和滚轮翻页</a> <a href="javascript:" mce_href="javascript:">腾讯网奇怪的PNG文件，拜师以求解惑</a> <a href="javascript:" mce_href="javascript:">更新lhgdialog-ver2.0.1弹出窗口组件</a> </div> </div> <script language="javascript"><!-- 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>

标签

#javascript #jquery #function #xhtml #div