我有html
结构
<div class="container">
<div class="row">
<div class="col-md-6">
<div class="papers left text-center">
<img src="http://wowthemes.net/demo/leroy/img/dummies/18.jpg" class="imgs" alt=""><br />
</div>
</div>
<div class="col-md-6">
<div class="papers right text-center">
<h4 class="notopmarg nobotmarg">Lorem ipsum dolor sit amet, consectetur adipiscing elit, sed do eiusmod tempor incididunt ut labore et dolore magna aliqua. Ut enim ad minim veniam, quis nostrud exercitation ullamco laboris nisi ut aliquip ex ea commodo consequat. Duis aute irure dolor in reprehenderit in voluptate velit esse cillum dolore eu fugiat nulla pariatur. Excepteur sint occaecat cupidatat non proident, sunt in culpa qui officia deserunt mollit anim id est laborum.</h4>
</div>
</div>
</div>
</div>
并在DOM
我尝试在左侧div
.papers.right
后,根据height
.papers.left
元素设置正确image
,即div
的高度jquery
使用以下height
技术加载,正如您在图片中所注意到的那样,$('.imgs').each(function () {
$(this).on('load', function () {
var height = $(this).closest('.papers.left').height();
$(this).closest('.row').find('.papers.right').css({ 'min-height': height }, { 'max-height': height }).height(height);
})
})
在右侧没有得到相同的设置。
$(document).ready()
但不幸的是,我无法成功。我不知道为什么,但即使在alert
内写之后,上述代码也没有响应。令我完全惊讶的是,在我分配height
之前保留setTimeout
时,它会起作用。所以我只是尝试CSS
,但即使这样也行不通。这种方法的任何其他替代方案,如果可能的话,请解释为什么这不起作用?
更新
这不是链接问题的重复,因为它是纯jquery
解决方案,我在这里处理一些jquery
技术,链接答案中提到的解决方案都没有为我工作。我无法在小提琴中重现这个问题,因为它也特定于整个网站,copy-mode
可能是一个可能的解决方案。
答案 0 :(得分:1)
您的css()
语法不正确。当使用object作为参数时,它是一个对象,您可以在其中拥有所需数量的属性。
变化:
.css({ 'min-height': height }, { 'max-height': height })
要
.css({ 'min-height': height, 'max-height': height })