在我的站点上使用 FlexSlider,我试图获取 slider 中第一个图像的高度。我认为下面的代码可以完成这项工作,但似乎图像加载得很晚,所以它们在这个 jQuery 事件上没有高度。该代码将返回“0”。
$(window).load(function() {
$(document).ready(function() {
var height = $(".flexslider>div>ul>li.flex-active-slide>a>img").height();
console.log(height);
});
});
但如果我在页面加载后在浏览器控制台中运行这段代码,则会返回正确的高度。
如何使用 jQuery 或 JavaScript 在页面加载/就绪时获取图像高度?
最佳答案
感谢您澄清 window.load 事件发生在 document.ready 之后,尽管这与实际问题无关。
代码返回“0”的原因是由于默认 flexslider.css 中的 css 类:
.flexslider .slides > li {display: none; -webkit-backface-visibility: hidden;} /* Hide the slides before the JS is loaded. Avoids image jumping */
解决方案是使用 callback API 等待 slider 正确加载。 :
$(window).load(function() {
$(".flexslider").flexslider({
start: function() {
var height = $(".flexslider a>img").first().height();
console.log(height);
}
});
});
关于javascript - FlexSlider:如何使用 JS 或 jQuery 在页面加载时获取图像高度?,我们在Stack Overflow上找到一个类似的问题: https://stackoverflow.com/questions/14810201/