求教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)都不行，求教各位了 展开
<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)都不行，求教各位了 展开
6个回答
展开全部
1、打开sublime text3，也可以用其他编辑器，这里新建一个HTML文档作为示范。
2、创建一下HTML文档的基本架构。
3、设置多个标签，这样等会可以有更多选择。
4、创建一个JS文档，并且与HTML文档关联。
5、输入var test = document.getElementById( "pp").offsetTop;document.write( test )。
6、offsetLeft就能知道元素到顶部的距离。
已赞过
已踩过<
评论
收起
你对这个回答的评价是？
展开全部
看看吧，发代码就屏蔽了
下一个这样写，设置滚动位置：
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";
}
希望能帮到你！
本回答被提问者和网友采纳
已赞过
已踩过<
评论
收起
你对这个回答的评价是？
展开全部
<!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>
已赞过
已踩过<
评论
收起
你对这个回答的评价是？
展开全部
某一个li给他一个class，如test获取他到浏览器顶部的距离直接用$('.test').css('top');
第二个问题设置浏览器的滚动条，首先必须浏览器存在滚动条，设置是这么写的：
document.documentElement.scrollTop = 0;为了兼容性html声明部分最好换成这个
<!DOCTYPE HTML PUBLIC "-//W3C//DTD HTML 4.01 Transitional//EN">
第二个问题设置浏览器的滚动条，首先必须浏览器存在滚动条，设置是这么写的：
document.documentElement.scrollTop = 0;为了兼容性html声明部分最好换成这个
<!DOCTYPE HTML PUBLIC "-//W3C//DTD HTML 4.01 Transitional//EN">
已赞过
已踩过<
评论
收起
你对这个回答的评价是？
展开全部
function scrollToTop(){
window.scrollTo(0,0);
}
window.scrollTo(0,0);
}
已赞过
已踩过<
评论
收起
你对这个回答的评价是？
更多回答（4）
推荐律师服务：
若未解决您的问题，请您详细描述您的问题，通过百度律临进行免费专业咨询
