Javascript检测大小窗口并执行新的功能

Question

嗨，我想显示一个javascript滑块，但如果大小小于825px，则禁用我创建了一个代码，但它们不起作用。我在这里搜索，但我没有找到任何答案。这是我的代码

$(window).ready(function() {
var wi = $(window).width();
$(window).resize(function() {
var wi = $(window).width();
  if (wi < 825){
  } else {

     // Slide function
                var slideIndex = 1;
                showDivs(slideIndex);
                function plusDivs(n) {
                showDivs(slideIndex += n);
                }
                function showDivs(n) {
                var i;
                var x = document.getElementsByClassName("mySlides");
                if (n > x.length) {slideIndex = 1}    
                if (n < 1) {slideIndex = x.length}
                for (i = 0; i < x.length; i++) {
                x[i].style.display = "none";  
                }
                x[slideIndex-1].style.display = "block";  
                }
                }

}); 
});

感谢您的任何帮助，幻灯片功能工作完美，但我没有检测到窗口大小。

Answer 1

定义一个函数来做幻灯片，添加一个条件来返回

function doSlide() {
  if (window.innerWidth < 825) {
    return
  }
  // Slide function
  ...your code
}

正如人们所建议的那样，直接调用它。如果需要，请附加调整大小事件。

$(window).ready(function() {
  doSlide()
  window.addEventListener('resize', doSlide)
}