Js滚动

最新推荐文章于 2025-09-05 11:22:47 发布

weixin_30640291

最新推荐文章于 2025-09-05 11:22:47 发布

阅读量51

点赞数

CC 4.0 BY-SA版权

文章标签： javascript ViewUI

原文链接：http://www.cnblogs.com/hanwater/archive/2010/01/30/1660019.html

本文介绍了一种使用JavaScript实现网页内容水平滚动的方法。通过监听鼠标事件来调整网页的滚动位置，实现了网页内容的平滑左右滚动效果。

<html>
<head>
<meta http-equiv="Content-Type" content="text/html; charset=gb2312" />
<title>无标题文档</title>
<SCRIPT language="javascript">
function movstar(a,time)
{
movx=setInterval("mov("+a+")",10);
}

function movover()
{
clearInterval(movx);
}

function mov(a)
{
scrollx=new_date.document.body.scrollLeft;
scrolly=new_date.document.body.scrollTop;
scrollx=scrollx+a;
new_date.window.scroll(scrollx,scrolly);
}

function o_down(theobject)
{
object=theobject;
}

function o_up(theobject)
{
object=theobject;
}

</SCRIPT>
</head>
<body>
<table width="100" border="0" cellspacing="0" cellpadding="0">
<tr>
    <td width="29" bgcolor="#99BECD">
<img src="http://www.bdtydq.cn/images/leftgun-2.jpg" alt="向左移动" onMouseDown="movover();movstar(-3,2)" onMouseUp="movover();movstar(-1,20)" onMouseOver="movstar(-1,10);o_down(this)" onMouseOut="movover();o_up(this)"></td>
    <td width="700" align="center" bgcolor="#99BECD"><IFRAME marginWidth=0 name="new_date" marginHeight=0 src="page.html" width="700" height="140" frameBorder=0 scrolling=auto></IFRAME></td>
    <td width="29" align="right" bgcolor="#99BECD">
<img src="http://www.bdtydq.cn/images/rightgun-2.jpg" alt="向右移动" onMouseDown="movover();movstar(3,2)" onMouseUp="movover();movstar(1,20)" onMouseOver="movstar(1,10);o_down(this) " onMouseOut="movover();o_up(this) "></td>
</tr>
</table>
</body>
</html>