大橙子网站建设,新征程启航
为企业提供网站建设、域名注册、服务器等服务
$(window).height();//是文档窗口高度
船营ssl适用于网站、小程序/APP、API接口等需要进行数据传输应用场景,ssl证书未来市场广阔!成为创新互联建站的ssl证书销售渠道,可以享受市场价格4-6折优惠!如果有意向欢迎电话联系或者加微信:18980820575(备注:SSL证书合作)期待与您的合作!
$("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
可以使用offset() 方法,该方法返回或设置匹配元素相对于文档的偏移(位置),该方法返回的对象包含两个整型属性:top 和 left,以像素计。此方法只对可见元素有效。
1、使用offset() 方法获取一个元素距离浏览器的顶部和左边的可视距离,代码如下:
html
head
script type="text/javascript" src="/jquery/jquery.js"/script
script type="text/javascript"
$(document).ready(function(){
$("button").click(function(){
x=$("p").offset();
$("#span1").text(x.left);
$("#span2").text(x.top);
});
});
/script
/head
body
p本段落的偏移是 span id="span1"unknown/span left 和 span id="span2"unknown/span top。/p
button获得 offset/button
/body
/html
2、运行的结果如下:
$(window).height();//是文档窗口高度
$("div").offset().top//是标签距离顶部高度(没有到下面的距离,比如$("div").offset().down)
$("div").offset().left//是标签距离右边高度(没有到下面的距离,比如$("div").offset().right)
$(document).scrollTop();//是滚动条高度
$("div").height();//是标签高度
你要的高度+$("div").height()+[$("div").offset().top-$(document).scrollTop()]=$(window).height();
经过简单的数学变换即可得到你要的值了
获取页面某一元素的绝对X,Y坐标,可以用offset():
var X = $(‘#DivID’).offset().top;
var Y = $(‘#DivID’).offset().left;
获取相对(父元素)位置:
var X = $(‘#DivID’).position().top;
var Y = $(‘#DivID’).position().left;
通过getBoundingClientRect方法获取对象位置,包含: left , top , right , bottom 4个参数值。
元素的顶部与父元素的顶部(实际的顶部,不是滚动后的顶部)的距离是 offsetTop,而父元素滚动后的顶部与实际顶部的距离是 scrollTop,所以只要 元素.offsetTop-父元素.scrollTop,就是元素与父元素滚动后实际可见的那个顶部的距离
$('h2#answers-title').offset().top-$(document).scrollTop();
$('h2#answers-title').offset().top h2#answers-title元素相对于document的垂直位置
$(document).scrollTop() 整个文档被上卷的高度
2者差就是$('h2#answers-title')相对于当前浏览器视图窗口的垂直位置
getBoundingClientRect()最先是IE的私有属性,现在已经是一个W3C标准。所以你不用当心浏览器兼容问题,不过还是有区别的:IE只返回top,lef,right,bottom四个值,不够可以通过以下方法来获取width,height的值:
//兼容所有浏览器写法:
var ro = object.getBoundingClientRect();
var Top = ro.top;
var Bottom = ro.bottom;
var Left = ro.left;
var Right = ro.right;
var Width = ro.width||Right - Left;
var Height = ro.height||Bottom - Top;
//有了这个方法,获取页面元素的位置就简单多了:
var X= this.getBoundingClientRect().left+document.documentElement.scrollLeft;
var Y =this.getBoundingClientRect().top+document.documentElement.scrollTop;