
$(window)height();//是文档窗口高度
$("div")offset()top//是标签距离顶部高度
$(document)scrollTop();//是滚动条高度
$("div")height();//是标签高度
用户要的高度+$("div")height()+[$("div")offset()top-$(document)scrollTop()]=$(window)height();
扩展资料:
JQuery参考函数
$(“元素”)prepend(content); 将content作为该元素的一部分,放到该元素的最前面
$(“元素”)prependTo(content); 将该元素作为content的一部分,放content的最前面
$(“元素”)remove(“exp”); 删除所有含有exp的元素
$(“元素”)wrap(“html”); 用html来包围该元素
$(“元素”)wrap(element); 用element来包围该元素
参考资料来源:百度百科-jQuery
<!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-211minjs"></script>
<script>
//原生
//获取div距离顶部的距离
var mTop = documentgetElementsByClassName('mdiv')[0]offsetTop;
//减去滚动条的高度
var sTop = documentbodyscrollTop;
var result = mTop - sTop;
consolelog(result);
//Jquery
mTop = $('mdiv')[0]offsetTop;
sTop = $(window)scrollTop();
result = mTop - sTop;
consolelog(result);
</script>
1、拖动后记录x,y值
给div加上mousePosition事件
function mousePosition(evt){
evt = evt || windowevent;
return {
x : evtclientX + documentbodyscrollLeft - documentbodyclientLeft,
y : evtclientY + documentbodyscrollTop - documentbodyclientTop
}
}
2、打开页面div定位
$(“div”)attr("top",y)attr("left",x);
扩展资料
在用js获取元素的位置之前,元素在页面的位置的计算公式,如下:
元素在页面的位置=此元素相对浏览器视窗的位置+浏览器滚动条的值;
用getBoundingClientRect()方法来获得某个元素相对浏览器视窗的位置 {这个方法返回的是一个对象,即Object,该对象具有4个属性:top,left,right,bottom }。
<html >
<head>
<meta >
<title>Demo</title>
</head>
<body style="width:2000px; height:1000px;">
<div id="demo" style="position:absolute; left:518px; right:100px; width:500px; height:500px;
background:#CC0000; top: 114px;">Demo为了方便就直接用绝对定位的元素</div>
</body>
</html>
<script>
documentgetElementById('demo')onclick=function (){
if (documentdocumentElementgetBoundingClientRect) {
alert("left:"+thisgetBoundingClientRect()left)
alert("top:"+thisgetBoundingClientRect()top)
alert("right:"+thisgetBoundingClientRect()right)
alert("bottom:"+thisgetBoundingClientRect()bottom)
var X= thisgetBoundingClientRect()left+documentdocumentElementscrollLeft;
var Y = thisgetBoundingClientRect()top+documentdocumentElementscrollTop;
alert("Demo的位置是X:"+X+";Y:"+Y)
}
}
</script>
以上就是关于jquery获取元素到屏幕底的可视距离全部的内容,包括:jquery获取元素到屏幕底的可视距离、如何从网页代码中看出一个元素到浏览器顶端的距离、js获取div到body左侧距离等相关内容解答,如果想了解更多相关内容,可以关注我们,你们的支持是我们更新的动力!
欢迎分享,转载请注明来源:内存溢出
微信扫一扫
支付宝扫一扫
评论列表(0条)