求教js如何获取元素到浏览器顶部的距离

网页结构如下:<bodystyle="overflow:auto"><div><ul><li></li><li></li>......</ul></div></body>... 网页结构如下:
<body style="overflow:auto">
<div>
<ul>
<li></li>
<li></li>
... ...
</ul>
</div>
</body>

当我滑动滚动条时,我想知道某一个li距离浏览器顶部的距离,我用$("li").scrollTop()一直都是0,无论我滚动条滚到哪。
还有一个问题,我怎么设置滚动条的位置,网上百了一下说是用$("div").scrollTop(300);但是我这边滚动条是在body上,我用document.documentElement.scrollTop(300),或者document.body.scrollTop(300)都不行,求教各位了
展开
 我来答
刺友互
高粉答主

2019-09-28 · 每个回答都超有意思的
知道答主
回答量:3979
采纳率:100%
帮助的人:69.7万
展开全部

1、锋姿打开sublime text3,也蔽蠢可以用其他编辑器,这里新建一个HTML文档作为示范。

2、创建一下HTML文档的基本架构。

3、设置多个标签,这样等会可以有更多选择。宏基陪

4、创建一个JS文档,并且与HTML文档关联。

5、输入var test = document.getElementById( "pp").offsetTop;document.write( test )。

6、offsetLeft就能知道元素到顶部的距离。

欧阳寒涵就是周大师
2013-03-25 · TA获得超过215个赞
知道小有建树答主
回答量:260
采纳率:100%
帮助的人:130万
展开全部

看看吧,发代码就屏蔽了


下一个纳卜李这弊悉样写,设置滚动位置:



window.onscroll= function(){bb();}

function bb(){

var obj = document.getElementById("aaa");

var topa = obj.offsetTop

var top=document.documentElement.scrollTop;   

document.getElementById("aaa"洞迟).innerHTML = topa-top; 

}

window.onload=function(){

document.documentElement.scrollTop = "200px";

}


希望能帮到你!

本回答被提问者和网友采纳
已赞过 已踩过<
你对这个回答的评价是?
评论 收起
JIA丨XIAN
推荐于2017-09-28 · TA获得超过630个赞
知道小有建树答主
回答量:475
采纳率:20%
帮助的人:320万
展开全部
<!doctype html>
<html lang="en">
<head>
    <meta charset="UTF-8">
    <style>
        body{
            margin: 0;
            padding: 0;
        }
      枯坦  .mdiv{
            width: 100px;
            height: 100px;
            background-color: #097df3;
        }
 模谨   </style>
</head>

<body>
<div style="height: 1000px"></div>
<div class="mdiv"></div>
<script src="jquery-2.1.1.min.js"></script>
<script>
    //原生
    //获取div距离顶部的距离
    var mTop = document.getElementsByClassName('mdiv')[0].offsetTop;
    //减去滚动条的高度
    var sTop = document.body.scrollTop;
    var result = mTop - sTop;
  旦败基  console.log(result);
    //Jquery
    mTop = $('.mdiv')[0].offsetTop;
    sTop = $(window).scrollTop();
    result = mTop - sTop;
    console.log(result);
</script>
</body>
</html>
已赞过 已踩过<
你对这个回答的评价是?
评论 收起
zhouzhijun1992
2013-03-25 · 超过11用户采纳过TA的回答
知道答主
回答量:44
采纳率:0%
帮助的人:39.2万
展开全部
某一个li给他一个class,如test获取他到浏览器顶缺散搏部的距离直接用$('.test').css('掘升top');
第二个问题设置浏览器的滚动条,首先必须浏览器存在滚动条,设置是这么写的:
document.documentElement.scrollTop = 0;为了兼容性html声明部分最好换成这个
<!DOCTYPE HTML PUBLIC "-/伏祥/W3C//DTD HTML 4.01 Transitional//EN">
已赞过 已踩过<
你对这个回答的评价是?
评论 收起
乌微月2S
2013-03-25 · TA获得超过5037个赞
知道大有可为答主
回答量:5361
采纳率:42%
帮助的人:2873万
展开全部
function scrollToTop(){
window.scrollTo(0,0);
}
已赞过 已踩过<
你对这个回答的评价是?
评论 收起
收起 更多回答(4)
推荐律师服务: 若未解决您的问题,请您详细描述您的问题,通过百度律临进行免费专业咨询

为你推荐:

下载百度知道APP,抢鲜体验
使用百度知道APP,立即抢鲜体验。你的手机镜头里或许有别人想知道的答案。
扫描二维码下载
×

类别

我们会通过消息、邮箱等方式尽快将举报结果通知您。

说明

0/200

提交
取消

辅 助

模 式