jQuery循环2–；覆盖尺寸与幻灯片'相匹配；s图像大小

我正在尝试使用jQuery在Cycle2幻灯片放映中获取当前幻灯片的图像大小

这样我就可以设置显示在.hover（）上的覆盖div（

.overlay

）的大小。正如您将在本文中看到的，它仅从第一个图像获取大小。图像也会有响应，因此

.overlay

还需要根据任何窗口大小更新其大小

这是链接和完整代码：

var imgwidth = $('.cycle-slide img').width();
var imgheight = $('.cycle-slide img').height();

$('.cycle-slide').hover(function () {        
    $('.overlay', this).css('width', imgwidth).css('height', imgheight).fadeIn();
    }, function() {
    $('.overlay', this).fadeOut();
});

如何获得与每张幻灯片的图像大小相匹配的

.overlay

---

非常感谢。

您可能应该在事件之后进入

循环以设置宽度。。类似于此：

$('.cycle-slideshow').on('cycle-after', function(event, optionHash, outgoingSlideEl, incomingSlideEl, forwardFlag) {
    $('.overlay', this).css({'width':$('img',incomingSlideEl).css('width'), 'height': $('img',incomingSlideEl).css('height')});
});


$('.cycle-slide').hover(function () {        
    $('.overlay', this).show();
    }, function() {
    $('.overlay', this).fadeOut();
});

您可能需要做的唯一一件事是设置事件外部第一个覆盖的宽度和高度，因为我认为它不会在第一张幻灯片上触发。
您的代码和建议工作得很好。非常感谢你。很高兴它成功了。下面是事件的api。有相当多的插件，如果你稍微使用一下插件，它们就会派上用场：这非常有用。再次感谢@lucuma