jquery获取元素距离浏览器顶部的可视高度_框架

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

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

<html>

<head>

$(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、运行的结果如下：

jquery获取元素索引值index()方法：

jquery的index()方法

搜索匹配的元素，并返回相应元素的索引值，从0开始计数。

如果不给

index()

方法传递参数，那么返回值就是这个jQuery对象集合中第一个元素相对于其同辈元素的位置。

如果参数是一组DOM元素或者jQuery对象，那么返回值就是传递的元素相对于原先集合的位置。

如果参数是一个选择器，那么返回值就是原先元素相对于选择器匹配元素中的位置。如果找不到匹配的元素，则返回-1。

复制代码代码如下:

foo

bar

baz

$('li')index(documentgetElementById('bar'));

//1，传递一个DOM对象，返回这个对象在原先集合中的索引位置

$('li')index($('#bar'));

//1，传递一个jQuery对象

$('li')index($('li:gt(0)'));

//1，传递一组jQuery对象，返回这个对象中第一个元素在原先集合中的索引位置

$('#bar')index('li');

//1，传递一个选择器，返回#bar在所有li中的做引位置

$('#bar')index();

//1，不传递参数，返回这个元素在同辈中的索引位置。

jquery获取元素索引值index()示例

复制代码代码如下:

//用于二级或者三级联动

建站素材

jquery特效

懒人主机

前端路上

$("#nav

a")click(function(){

//四个经典的用法

var

index1

$("#nav

a")index(this);

var

index2

$("#nav

a")index($(this));

var

index3

$(this)index()

var

index3

$(this)index("a")

alert(index3);

return

false;

});

//引入jQuery

var a=$("#a");

var boxX=aoffset()left;

var boxY=aoffset()top;

amousemove(function(e){

var x = epageX;

var y = epageY;

var zX=x-boxX;

var zY=y-boxY;

$(this)text("X:"+zX+"Y:"+zY);

});

</script>

jquery代码如下：$("div")scrollTop()

scrollTop()方法介绍：

scrollTop()方法用于返回或设置匹配元素的滚动条的垂直位置。

小案例：

<!doctype html>

<head>

<title>获取滚动条离顶部的高度</title>

div{

width: 200px;

height: 200px;

overflow: scroll;

}

</style>

</head>

<body>

<div>

获取滚动条离顶部的高度<br />

</div>

$(document)ready(function(){

$("btn")click(function(){

alert($("div")scrollTop());

});

</script>

<button class="btn">获得当前滚动条的偏移量</button>

</body>

</html>

案例截图：

以上就是关于jquery获取元素距离浏览器顶部的可视高度全部的内容，包括:jquery获取元素距离浏览器顶部的可视高度、jquery中怎么获得特定元素的索引值、jquery获取鼠标在父元素的坐标等相关内容解答，如果想了解更多相关内容，可以关注我们，你们的支持是我们更新的动力！

欢迎分享，转载请注明来源：内存溢出

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

jquery获取元素距离浏览器顶部的可视高度

发表评论

评论列表（0条）