Jquery 为什么高度返回0
我在主页上有一个旋转幻灯片,我想根据图像的高度减去标题的高度减去箭头的高度来设置内容的高度。出于某种原因,标题或图像的高度都不会返回为0以外的任何值 请看这里: 当图像不够高时,摘录(图像旁边标题下的内容)会切入箭头,因此我想根据图像高度使用CSS进行设置 我的js:Jquery 为什么高度返回0,jquery,wordpress,Jquery,Wordpress,我在主页上有一个旋转幻灯片,我想根据图像的高度减去标题的高度减去箭头的高度来设置内容的高度。出于某种原因,标题或图像的高度都不会返回为0以外的任何值 请看这里: 当图像不够高时,摘录(图像旁边标题下的内容)会切入箭头,因此我想根据图像高度使用CSS进行设置 我的js: jQuery(document).ready(function($){ $('.slides .slide').each(function(){ var slideHeight = $(this).height();
jQuery(document).ready(function($){
$('.slides .slide').each(function(){
var slideHeight = $(this).height();
var headerHeight = $('.slide-content header').height();
var arrowHeight = $('.flex-direction-nav').height();
var contentHeight = slideHeight - headerHeight - arrowHeight;
});
});
新建JS(编辑以设置高度,并将其他高度调用拉到每个循环之外):
在测量图像高度之前,必须等待图像加载。注意,DOM就绪并不意味着图像已经加载。请尝试以下方法:
jQuery(window).load(function($){
var headerHeight = $('.slide-content header').height(),
arrowHeight = $('.flex-direction-nav').height();
var imgHeights = $('.slides .slide').map(function() {
return $(this).height() - headerHeight - arrowHeight;
});
});
发件人:
加载事件在元素和所有子元素完全加载后发送给元素。此事件可以发送到与URL关联的任何元素:图像、脚本、帧、iFrame和窗口对象
避免循环中的DOM查询。在
.each()
之前缓存$('.slide content header').height()
(以及其他高度)。通常,您无法在DOM ready上可靠地读取图像的高度,因为图像在该点尚未完全加载(除非已缓存)。我想,您必须执行一个$(文档)。在('load',…
)上,将DOM查询拉出循环只会返回一个数字。您正在执行.height()
在两个查询中,您都会得到两个数字。@pst不是真的..ready
等待DOM,加载
-对于所有资产,如图像、视频、帧等。我也尝试了窗口加载,但仍然不起作用。看一看。根据上面的评论,我将高度调用拉到了循环之外。哦,很抱歉,它还没有设置高度。它只是查找高度,然后设置高度。好的,现在它可以:)您不移动var slidewhight=$(this.height()代码>循环外部-必须为每个imageoh woopsie计算它。仍然没有归还任何东西:(
jQuery(window).load(function($){
var headerHeight = $('.slide-content header').height(),
arrowHeight = $('.flex-direction-nav').height();
var imgHeights = $('.slides .slide').map(function() {
return $(this).height() - headerHeight - arrowHeight;
});
});