`
好好学习-天天向上
  • 浏览: 34638 次
  • 性别: Icon_minigender_1
  • 来自: 北京
文章分类
社区版块
存档分类
最新评论

jq 关于height

阅读更多

height:高度

innerHeight:高度+补白 
outerHeight:高度+补白+边框,参数为true时:高度+补白+边框+边距

html代码:

<div class="width: 150px;height:20px;float: left;border: 2px solid red;margin: 10px;margin: 10px;padding: 10px;" id="test">jjjjj</div>

js代码:

alert($("#test").height()); 
alert($("#test").innerHeight()); 
alert($("#test").outerHeight()); 
alert($("#test").outerHeight(true));

结果: 
在ie中的结果:17px,37px,41px,61px 
在ff中的结果:20px,40px,44px,64px

 

推荐参考地址:http://www.css88.com/jqapi-1.9/height/

分享到:
评论

相关推荐

    JQ高仿select控件

    &lt;p&gt;JQ高仿select控件 &lt;br/&gt; &lt;div style="height:100px;border-bottom:5px solid #ff0000;"&gt; 张三 李四 王二麻子 ...

    JQ height()、innerHeight()、outerHeight()函数的区别

    NULL 博文链接:https://onestopweb.iteye.com/blog/2359446

    全屏幻灯片JQ+JS+CSS3

    height: 300px;width: 930px;margin: 0 auto;} #slideshow a{float: left;display: inline;} #slideshow .img{position: absolute;width: 930px;height: 300px;overflow: hidden} #slideshow .img span{position: ...

    jQuery自动适应高度布局代码.zip

    jQuery自动适应高度布局代码是一款设置height页面自动适应高度布局效果代码。

    jq22hiprint1202201905170106.zip

    -- 模板对象添加打印面板 paperHeader:页眉线 paperFooter:页尾线--&gt;var panel = hiprintTemplate.addPrintPanel({ width: 100, height: 130, paperFooter: 340, paperHeader: 10 }); &lt;!-- 文本 打印面板添加...

    jQuery使用height()获取高度需要注意的地方

    主要介绍了jQuery使用height()获取高度需要注意的地方,对于display:none或者隐藏的部分无法获取到其高度,这是使用jQuery的height方法需要注意的地方,需要的朋友可以参考下

    jquery+raphael

    image_height = $("#rImg").height(), ration_r = image_width/image_height; $("#selectArea").css({ background:"#888888", width:canvans_width, height:canvans_height }); var paper = Raphael("selectArea",...

    animated-sprite:这是一个 JavaScript(带有 jQ​​uery)文件,它使用 div 的背景图像来创建动画和可选的翻转效果

    这是一个 JavaScript(带有 jQ​​uery)文件,它使用 div 的背景图像来创建动画和可选的翻转效果。 要求 spriteControl.js 中的函数使用 jQuery。 使用这些功能 将 spriteControl.js 添加到网页。 将 ...

    简单易用的jQuery页面切换动画效果

    line-height: 24.0px; font: 12.0px 'Heiti SC Light'; color: #323333} span.s1 {font-kerning: none} 效果描述: 一组新老结合的代码实现的动画效果 为什么说是新老结合呢,首先,页面是基于jQuery实现的...

    jQuery图片裁剪插件 功能非常强大

    上次我们介绍过一款基于HTML5的图片马赛克效果,今天我们要来介绍一款基于... height = data.naturalHeight, rotate = data.rotate, rotated = getRotatedSizes({ width: width, height:[......] 阅读全文&gt;&gt;

    漂亮的jQuery电脑桌面界面特效.zip

     height: 100%;  width: 100%;  overflow: hidden; } .lock {  z-index: 10;  position: absolute;  width: 100%;  height: 100%;  background: url(images/lock.jpg) no-repeat center;  ...

    hosejs:备用jq,适用于javascripter

    jq ? 对于已经使用javascript的人来说,javascript显然是更好的选择。特征使用ramda.js(1.3版或更高版本)进行数据处理您可以使用 例如。 http https://swapi.co/api/people/1/ | j -r "props(['name', 'height']...

    JS:利用jq语句实现盒子对角移动

    博主也是在学js,老师出了这么一道题,博主... height: 50px; background-color: yellow; position: absolute; left:10px; top:50px; } 移动 var wid=0; var hei=0; var offset=$('#ff').offset(); var widd=

    jq给页面添加覆盖层遮罩的实例

    先引入jq代码,然后代码如下: $(function(){ var docHeight = $(document).height(); //获取窗口高度 $('body').append('&lt;div id=overlay&gt;&lt;/div&gt;'); $('#overlay') .height(docHeight) .css({ 'opacity': .9...

    使用jquery中height()方法获取各种高度大全

    .height()); //浏览器当前窗口可视区域高度 alert&#40;$(document&#41;.height()); //浏览器当前窗口文档的高度 alert&#40;$(document.body&#41;.height());//浏览器当前窗口文档body的高度 alert&#40;$(document....

    jQuery css3的简单的纵向时间轴代码.zip

    一款非常简单的jQuery纵向时间轴代码,无论li内容多少,直线都不会超出,并且红点永远居中的jQuery垂直时间轴插件。 js代码 ...$(".line").height($(".about4_main").height()-h1-h); }); [removed]

    jQuery实现居于左侧的弹出菜单

    line-height:117px;} #box{ width:0; overflow:hidden; float:left;} .btn1{ display:block; border:none; cursor:pointer; float:left; background:url(../images/slide-button-active.gif) no-repeat; width:43px...

    JQ(四)—-JQ-动画-节点-事件-委托

    JQ-动画-节点-事件-委托一、 jquery动画二、尺寸相关、滚动事件三、jquery属性操作四、jquery循环五、jquery事件六、事件冒泡七、事件委托八、jquery元素节点操作 一、 jquery动画 通过animate方法可以设置元素某...

    DIV+CSS+jQ实现省市联动可扩展

    就默默的找了京东、亚马逊、淘宝、当当等他们关于省市区是怎么做的。图如下: 最后我结合一下做了如下图: 废话不多说上源码: &lt;style type="text/css"&gt; #divProCity { position:absolute; width:350...

    jquery 仿QQ相册

    * {line-height: 150%} .image {text-align: center; line-height: 590px; margin: 30px auto 0px; width: 850px; height: 620px} .image img { overflow:hidden} img {border:0px} #photo_content {text-align: ...

Global site tag (gtag.js) - Google Analytics