调整大小事件不会在每次点击时触发

Resize Event Not Firing On Every Click

我创建的用于在我的模式中显示我的光滑滑块图像的调整大小事件仅在初始宽度上触发一次。如果我关闭模式,手动移动 window 的宽度,然后再次打开模式,图像不会调整大小。因此,他们没有出现。

HTML:

<section>
<button id='show' onClick='showDialog()'><img src="img./(This is where I put the name of my image).jpg"style="width:100%;max-width: 400px"></button>
<div id='dialog'>
  <span>
    <div id="mySlickSlider">
        <div class="mySlide">
        (This is where I included the images in my slick slider)
        </div>
    </div>
  </span>
<button id='close' onClick='closeDialog()'>&times;</button>
</div>
</section>

JS:

$('#show').on('click', function(e){
  $('#mySlickSlider').resize();
});

由于调整大小功能不起作用,我对不同的 类 使用了超时功能,它包含我的光滑滑块并将其设置为 0,因此没有延迟。

$(window).on('click', function () {
  setTimeout(function() {
     $('.mySlideNav').slick("getSlick").refresh();
     $('.mySlide').slick("getSlick").refresh();
  },0);
});