Javascript bx滑块-获取图像的高度和宽度

我试图获得bx滑块幻灯片中图像的高度和宽度，问题是每个图像（没有加载的第一个）都返回零

以下是我的代码示例：

$('.slides > li > img').each(function(){

    var $this = $(this);
    var imgWidth = $this.width();
    var imgHeight = $this.height();

    console.log(imgWidth);
    console.log(imgHeight);

})

我还尝试将它们放入一个加载函数中，如下所示：

$('.slides > li > img').each(function(){


    $this.on('load', function(){

    var $this = $(this);
    var imgWidth = $this.width();
    var imgHeight = $this.height();

    console.log(imgWidth);
    console.log(imgHeight);

 }
})

。。。但它仍然不起作用=\

任何帮助都将不胜感激

编辑：

这是一把小提琴：

编辑2:

---

我现在看到，当模式设置为淡入淡出时，其余的

元素被设置为显示：无。尽管如此，是否有办法获得图像尺寸？

尝试类似的方法

$('.slider img').each(function(){
    $this = $(this);
    var imgWidth = $this.width();
    var imgHeight = $this.height();

    console.log(imgWidth);
    console.log(imgHeight);
});

---

滑块隐藏除第一个图像外的所有图像，并且隐藏的图像没有尺寸，因此您必须使用源（字面上）创建新的图像对象，然后在加载图像后从中获取尺寸

$(document).ready(function () {
    $('.normal-slides').bxSlider({
        mode: 'fade',
        auto: false,
        pager: false
    });


    $('.normal-slides img').each(function () {
        var img = this;
        var new_img = new Image();
        new_img.onload = function() {
            console.log('imgWidth = ' + this.width)
            console.log('imgHeight = ' + this.height)
        }
        new_img.src = img.src;
    });
});

---

添加html以显示要选择的内容我猜只有第一个图像可见，因此其他图像设置为不显示或类似显示，如果没有一些技巧，您无法获取隐藏图像的尺寸，您是否尝试获取图像的实际尺寸，或BX滑块将其设置为什么（对于所有图像，这可能都是相同的）？@adeneo我现在看到当模式设置为淡入淡出时-其余的

元素设置为

显示：无

。尽管如此，有没有办法获得图像尺寸？@jonasnas这是fiddle@Ziik-当然，像这样->谢谢你的回答，但是我找不到我的代码的问题。我已经更新了你的f在我的部分代码中，出现了一个问题-第二幅图像的高度和宽度为零。在这里，我还尝试了一个回调函数，但尺寸仍然为零-哦，请参阅主帖子的编辑2。再次感谢！还有一个问题-如果我为图像编写css规则，有没有办法，比如说

width:100%

（），我可以得到第三张幻灯片的新拉伸高度和宽度值吗，因为它原来较小？这会得到图像的实际大小，如果您要查找页面中显示的大小，您必须将图像插入DOM并使其在页面上可见，否则它将没有这些值，因为它不是真正相关的在父元素可见以及应该位于何处之前，将其还原到父元素。我认为情况就是这样。感谢您花时间解释所有这些=]