Window scrollBy() 方法

最新推荐文章于 2024-07-26 11:22:40 发布

最新推荐文章于 2024-07-26 11:22:40 发布 · 1.3k 阅读

文章标签：

#Window #scrollBy

JavaScript 专栏收录该内容

188 篇文章

订阅专栏

本文介绍了scrollBy()方法的定义及用法，该方法能够将页面内容按指定像素数进行滚动。文章通过一个实例展示了如何使用scrollBy()方法实现页面的滚动效果。

定义和用法

scrollBy() 方法可把内容滚动指定的像素数。

注意： 要使此方法工作 window 滚动条的可见属性必须设置为true！

语法

scrollBy(xnum,ynum)

参数	描述
xnum	必需。把文档向右滚动的像素数。
ynum	必需。把文档向下滚动的像素数。

实例

<!DOCTYPE html>
<html>
<head>
<meta charset="gb2312">
<title>滚动条</title>
<script>
function scrollWindow(){
	window.scrollBy(100,100);
}
</script>
</head>
<body>
<script>
 for (var i=0;i<50;i++)
 {
 	document.write("第" + (i+1) + "行; ");
 	//输出空格，用于产生横向滚动条
 	for (var j=0; j<50; j++)
 	{
 		document.write("&nbsp; &nbsp; ");
 	}
 	document.write ("<br>");
 }
</script>
<input type="button" onclick="scrollWindow()" value="滚动条" />
<script>
 for (var i=0;i<100;i++)
 {
 	document.write("第" + (i+1) + "行; ");
 	//输出空格，用于产生横向滚动条
 	for (var j=0; j<100; j++)
 	{
 		document.write("&nbsp; &nbsp; ");
 	}
 	document.write ("<br>");
 }
</script>
</body>
</html>