jquery - outerHeight() 和内部图片

标签 jquery html css

我在首次加载具有 outerHeight 的页面时遇到问题。

outerHeight() 返回的值是 27 的倍数。

jQuery

$('.entries').each(function(r) {    
$(this).attr("value", $(this).outerHeight()+15);
})

HTML:

<div class="entries">
    <div class="container_entrie">
    <span class="meta"><span class="title">Daily Inspiration #128</span> 
   <span class="date">- april 10th 2009 </span></span>      
    <img src="images/content/four.png" />
    </div>
</div> 

CSS:

.entries {  
position:absolute;  
overflow:hidden;
cursor:pointer;
width:200px;
-moz-border-radius: 3px;
-webkit-border-radius: 3px;
padding:6px;
background-color:#171717;   
}

.meta{ 
position:absolute; 
bottom:0; float:left; width:190px; padding-top:5px; padding-bottom:5px; padding-left:5px; padding-right:5px;  font-size:11px; font-weight:bold; line-height:14px;
background-color:#000; 
/* for IE */
filter:alpha(opacity=70);
/* CSS3 standard */
opacity:0.7;
border-top:1px solid #000;
}           
.meta span.title{color:#FFF; }
.meta span.date{color:#999999; font-weight:normal;}
.container_entrie{position:relative; width:200px; float:left; overflow:hidden; }

并且全部加载完毕,刷新后一切正常。

所以我想知道这是否与 container_entrie 中的图像有关?

感谢您的帮助 =)

最佳答案

您的 javascript 是从哪里调用的?除非您在图像上设置高度,否则如果将它放在 $(...)($(document).ready 的简写)中,就会遇到问题。尝试将它放在 $(window).load(...) 中,看看是否有帮助。 Load 在下载完所有 内容后触发,Ready 是一个伪事件,当 dom 准备好被弄乱时触发。

关于jquery - outerHeight() 和内部图片,我们在Stack Overflow上找到一个类似的问题: https://stackoverflow.com/questions/872961/

相关文章:

javascript - JQuery UI 自动完成有时不显示所有结果

php - div的div 'infront'?

html - 使用 html 和 css 更改文本在屏幕上的显示方式

image - 减少但不增加背景尺寸

css - 现代图片库 : fluid or elastic?

javascript - 访问和单击没有 ID 或类标签的按钮

javascript - 显示和隐藏序列中的列表元素

JQuery $ (".some-element-id").length 在我使用 JQuery 创建它们后返回 0

javascript - 如果条件在 Bootstrap 开关中不起作用

javascript - 如何处理使用:hover and :focus for clickable top-level links?的触摸屏设备上的多级菜单