如何滚动以显示网页的一部分

Question

除了锚点，您还可以使用JavaScript在网络浏览器中控制/读取滚动条的不同方式有哪些？ -除非您可以动态创建锚点并告诉浏览器向下滚动到该锚点。

Answer 1

var coord = {top:null,left:null,width:null,height:null};
        if (typeof window.pageYOffset == 'number') {
            coord.top = window.pageYOffset; coord.left = window.pageXOffset;            
        } else if (document.body && (document.body.scrollLeft || document.body.scrollTop)) {
            coord.top = document.body.scrollTop; coord.left = document.body.scrollLeft;
        } else if (document.documentElement && (document.documentElement.scrollLeft || document.documentElement.scrollTop)) {
            coord.top = document.documentElement.scrollTop; coord.left = document.documentElement.scrollLeft;
        }

        if (typeof window.innerWidth == 'number') {
            coord.width = window.innerWidth; coord.height = window.innerHeight;
        } else if (document.documentElement && (document.documentElement.clientWidth || document.documentElement.clientHeight)) {
            coord.width = document.documentElement.clientWidth; coord.height = document.documentElement.clienthHeight; 
        } else if(document.body && (document.body.clientWidth || document.body.clientHeight)) {
            coord.width = document.body.clientWidth;
            coord.height = document.body.clientHeight;
        }

Answer 2

这是一个如何无需锚点即可控制X / Y滚动的示例。 （ScrollX / ScrollY）

我想关键的部分如下

function saveScrollCoordinates() { 
  document.Form1.scrollx.value = (document.all)?document.body.scrollLeft:window.pageXOffset; 
  document.Form1.scrolly.value = (document.all)?document.body.scrollTop:window.pageYOffset; 
}

Answer 3

滚动任意数量：

//Parameters being the amount by which to scroll in pixels (horizontal and vertical)
window.scrollBy(50, 50);

滚动到某个点：

 window.scrollTo(0, 30);

读取当前位置：

 document.body.scrollLeft
 document.body.scrollTop

Answer 4

使用scrollTop属性（所有元素的固有属性），您可以滚动到特定的像素高度。 因此，滚动到特定锚点的高度将涉及查询该锚点的偏移量并相应地设置scrollTop 。 仅出于说明目的； 这就是使用jQuery滚动到指定元素的方式：

var top = $('div#something').offset().top;
$(document).scrollTop(top);

注意：jQuery的实现可能会产生误导； 它接受document但是具有scrollTop属性的最顶层元素实际上是document.documentElement （通常引用<HTML> ）。

还有一个scrollLeft属性用于水平滚动。

当然，您可以阅读以下属性：

var currentScrollTop = document.documentElement.scrollTop;

Answer 5

原型实现了scrollTo()函数，该函数使滚动到特定元素非常容易：

$("#elementID").scrollTo();

该实现在内部调用window.scrollTo进行实际的滚动。

如何滚动以显示网页的一部分

问题描述

5 个解决方案

解决方案1
1 2010-09-13 00:24:57

解决方案2
1 2009-05-14 18:43:03

解决方案3
1 已采纳 2009-05-14 18:43:34

解决方案4
1 2009-05-14 18:45:19

解决方案5
1 2009-05-14 18:46:26

如何滚动以显示网页的一部分

问题描述

5 个解决方案

解决方案1 1 2010-09-13 00:24:57

解决方案2 1 2009-05-14 18:43:03

解决方案3 1 已采纳 2009-05-14 18:43:34

解决方案4 1 2009-05-14 18:45:19

解决方案5 1 2009-05-14 18:46:26

解决方案1
1 2010-09-13 00:24:57

解决方案2
1 2009-05-14 18:43:03

解决方案3
1 已采纳 2009-05-14 18:43:34

解决方案4
1 2009-05-14 18:45:19

解决方案5
1 2009-05-14 18:46:26