javascript - 使用javascript获取滚动条的位置

Question

因此，当我滚动我的网页时，我试图显示一个类似框的工具提示，我希望它跟随页面右侧的滚动条。

我环顾四周，发现了一些可以尝试实现的东西，如下所示:

function returnPercentHeight(){
    var a = document.getElementById('rightPanel').scrollTop;
    var b = document.getElementById('rightPanel').scrollHeight - document.getElementById('rightPanel').clientHeight;
    return ((a/b) * 100);
}

然后我在末尾附加一个 % 并将工具提示的上边距设置为该返回值。这工作得很好(有点)我必须调整 return((a/b) * x) 部分 (x) 以使其根据浏览器窗口的大小跟随滚动条。有没有更好的方法来完成我想做的事情？ (注意:我只能使用 javascript，请不要使用 JQuery。)

编辑:

只有 ID 为“RightPanel”的 div 滚动，我没有使用浏览器上的滚动条，而是内部 div 上的滚动条。

Answer 1

三种方式:

首先:

就是使用固定位置如下;

Position: Fixed;

第二个:

使用 jQuery；

$(function(){
   $(window).on('scroll', function() {
     var scrollPOS = $(document).scrollTop();
     $('.scroll').css({
        top: scrollPOS
     });
   }).scroll();
});

第三:

和前面一样，只有动画；

$(window).on('scroll', function() {
  $("#div").stop().animate({
     "marginTop": ($(window).scrollTop()) + "px", 
     "marginLeft":($(window).scrollLeft()) + "px"}, "slow" );
});