jquery 各种高度

alert($(window).height()); //浏览器时下窗口可视区域高度
alert($(document).height()); //浏览器时下窗口文档的高度
alert($(document.body).height());//浏览器时下窗口文档body的高度
alert($(document.body).outerHeight(true));//浏览器时下窗口文档body的总高度 包括border padding margin
alert($(window).width()); //浏览器时下窗口可视区域宽度
alert($(document).width());//浏览器时下窗口文档对于象宽度
alert($(document.body).width());//浏览器时下窗口文档body的高度
alert($(document.body).outerWidth(true));//浏览器时下窗口文档body的总宽度 包括border padding margin

alert($(document).scrollTop()); //获取滚动条到顶部的垂直高度
alert($(document).scrollLeft()); //获取滚动条到左边的垂直宽度
时间: 2024-07-29 12:44:29

jquery 各种高度的相关文章

jquery实现高度的获取-位置函数

一.位置函数 1.offset() 获取匹配元素在当前视口的相对偏移.返回的对象包含两个整形属性:top 和 left.此方法只对可见元素有效. 2.innerWidth() 获取第一个匹配元素内部区域宽度(包括补白.不包括边框).此方法对可见和隐藏元素均有效.返回值:整型数据3.innerHeight() 获取第一个匹配元素内部区域高度(包括补白.不包括边框).此方法对可见和隐藏元素均有效.返回值:整型数据 4.outerWidth() 获取第一个匹配元素外部宽度(默认包括补白和边框).此方法

jquery获取高度

分为以下几种: .height() -获取匹配元素集合中的第一个元素的当前计算高度值 或 设置每一个匹配元素的高度值. -.css('height') 和 .height()之间的区别是后者返回一个没有单位的数值,前者是返回带有完整单位的字符串.当一个元素的高度需要数学计算的时候推荐使用.height() 方法 . -这个方法同样能计算出window和document的高度. $(window).height();  $(document).height(); .innerHeight() -为

jquery iframe高度自适应

$(document).ready(function () { $("#test").load(function () { var thisheight = $(this).contents().find("body").height() +10; $(this).height(thisheight < 500 ? 500 : thisheight); }); }); 很多管理系统中,都使用iframe进行信息内容的展示方式,或者作为主菜单的链接展示内容. 使

js和jquery如何获取图片真实的宽度和高度_javascript技巧

在做pc网页的时候,有时候会考虑按照插入的图片的尺寸来判断图片是横图还是竖图.然后判断过后给予不同的展示方式! 另外一种就是在手机页面上,在新闻页插入的图片往往都是按照图片的原尺寸来展示,如果手机屏幕太小,太大的图就会超出去!这时候有两种解决办法 1)给所有的图片加上这样的样式 代码如下: .news img{margin:5px auto; display:block;width:100%; height:auto;} 但是这种方式有另外一个问题就是,如果插入的图片本身就很小的话,也会被直接拉

jQuery将物体居中,并且转换显示和隐藏

今天来给大家贴一段代码,代码的作用就是利用jQuery将物体居中,并且转换显示和隐藏: 首先建立一个div标签并且写好css样式,具体如下 然后我想要的效果是当我点击了button这个按钮,test可以居中显示,第二次点击一次test消失,第三次点击又居中显示,这样循环下去: 具体js代码如下: 稍微解释一下代码的意思: 1.$('#test').get(0).flag = true;是为了建立一个标识,告诉浏览器什么时候应该显示,什么时候应该隐藏 2.上面的top就是让浏览器窗口的高度减去自己

js与jQuery实现方式对比汇总

CreateTime--2016年12月16日09:11:23Author:Marydonjs与jQuery实现方式对比汇总 <div id="ListContainer" style="border:1px solid red;height:100px;width:100px;"></div> 1.控制元素的显示与隐藏 javascript方式 /*控制div隐藏*/ document.getElementById("ListCo

网页宽高自适应大小

如今,显示器的分辨率越来越多,终端也变得多样化,web开发页面的自适应问题越来越多,如果不做处理,一旦显示器的分辨率发生变化,展示的内容可能出现许多意料之外的排版问题.关于不同终端的展示问题可以通过响应式布局来实现,而不需要响应式布局时我们需要自己来避免上述问题. 宽度自适应: 1.设置最外层容器(如 DIV)的 width 为 100%: 2.如果网站头部有图片展示,那就不能简单设置宽度为 100%,会出现 repeat 的情况,或者图片大小超出最外层容器宽度,此时可以设置最外层容器宽度为固定

玩转JavaScript的Web API : 原生js操控显式HTML元素

之前做过两道前端,阿里和网易各一道.下文内容和解题的核心并无关系,只是当时想了解jQuery那么处理原生js的原理是什么,所以小结一下. 题目一:判断两个矩形元素是否重叠. 开始无尽的跑偏.... Html元素都是HTMLElement实例,下例将div换成script.html都成立. HTMLElement继承自Element,Element继承自Node. 定义一个长宽都是500px的红色div. 但是.style.height的方式获取不到高度值.如果使用style设置高度是有效的,再读

Javascript 常用函数【3】

jquery选中radio //如果之前有选中的,则把选中radio取消掉 $("#tj_cat .pro_category").each(function() { if ($(this).attr('checked')){ $(this).attr('checked' ,false); } }); //获取被选中的标签的值 radio:(checkbox和这个一样) var val=$('input:radio[name="sex"]:checked').val(