jquery 如何获得一个元素(比如div)的底部(或顶部)距屏幕顶部距离的象素值

jquery 如何获得一个元素(比如div)的底部(或顶部)距屏幕顶部距离的象素值,第1张

$(obj)offset()top - $(window)scrollTop()。

拓展:

1、jQuery是一套跨浏览器的JavaScript库,简化HTML与JavaScript之间的 *** 作。由John Resig在2006年1月的BarCamp NYC上发布第一个版本。目前是由 Dave Methvin 领导的开发团队进行开发。全球前10000个访问最高的网站中,有59%使用了jQuery,是目前最受欢迎的JavaScript库。

2、jQuery由美国人John Resig创建,至今已吸引了来自世界各地的众多javascript高手加入其team,包括来自德国的Jörn Zaefferer,罗马尼亚的Stefan Petre等等。jQuery是继prototype之后又一个优秀的Javascrīpt框架。其宗旨是——WRITE LESS,DO MORE,写更少的代码,做更多的事情。由于目前高校基本尚未开JavaScript的相关课程,目前jQuery的学习,使用,研究都仅限于在职Web程序员之间。

可以使用offset() 方法,该方法返回或设置匹配元素相对于文档的偏移(位置),该方法返回的对象包含两个整型属性:top 和 left,以像素计。此方法只对可见元素有效。

1、使用offset() 方法获取一个元素距离浏览器的顶部和左边的可视距离,代码如下:

<html>

<head>

<script type="text/javascript" src="/jquery/jqueryjs"></script>

<script type="text/javascript">

$(document)ready(function(){

  $("button")click(function(){

    x=$("p")offset();

    $("#span1")text(xleft);

    $("#span2")text(xtop);

  });

});

</script>

</head>

<body>

<p>本段落的偏移是 <span id="span1">unknown</span> left 和 <span id="span2">unknown</span> top。</p>

<button>获得 offset</button>

</body>

</html>

2、运行的结果如下:

1$(window)height();//是文档窗口高度

2$("div")offset()top//是标签距离顶部高度(没有到下面的距离,比如$("div")offset()down);

3$("div")offset()left//是标签距离右边高度(没有到下面的距离,比如$("div")offset()right);

4$(document)scrollTop();//是滚动条高度;

5$("div")height();//是标签高度。

1jQuery是一个快速、简洁的JavaScript框架,是继Prototype之后又一个优秀的JavaScript代码库(或JavaScript框架)。jQuery设计的宗旨是“write Less,Do More”,即倡导写更少的代码,做更多的事情。它封装JavaScript常用的功能代码,提供一种简便的JavaScript设计模式,优化HTML文档 *** 作、事件处理、动画设计和Ajax交互。

2jQuery的核心特性可以总结为:具有独特的链式语法和短小清晰的多功能接口;具有高效灵活的css选择器,并且可对CSS选择器进行扩展;拥有便捷的插件扩展机制和丰富的插件

div里可以定光标吗?

下面两个方法可以获取鼠标在div 的位置坐标,希望你可以用得上

function getX(obj) {

var parObj = obj;

var left = objoffsetLeft;

while (parObj = parObjoffsetParent) {

left += parObjoffsetLeft;

}

return left;

}

function getY(obj) {

var parObj = obj;

var top = objoffsetTop;

while (parObj = parObjoffsetParent) {

top += parObjoffsetTop;

}

return top;

}

$('h2#answers-title')offset()top-$(document)scrollTop();

$('h2#answers-title')offset()top h2#answers-title元素相对于document的垂直位置

$(document)scrollTop() 整个文档被上卷的高度

2者差就是$('h2#answers-title')相对于当前浏览器视图窗口的垂直位置

以上就是关于jquery 如何获得一个元素(比如div)的底部(或顶部)距屏幕顶部距离的象素值全部的内容,包括:jquery 如何获得一个元素(比如div)的底部(或顶部)距屏幕顶部距离的象素值、jquery获取元素距离浏览器顶部的可视高度、jquery怎么获取元素距离屏幕的位置等相关内容解答,如果想了解更多相关内容,可以关注我们,你们的支持是我们更新的动力!

欢迎分享,转载请注明来源:内存溢出

原文地址:https://54852.com/web/9292768.html

(0)
打赏 微信扫一扫微信扫一扫 支付宝扫一扫支付宝扫一扫
上一篇 2023-04-26
下一篇2023-04-26

发表评论

登录后才能评论

评论列表(0条)

    保存