Javascript 激活窗口调整功能

所以我有一个幻灯片，里面有我不想在像素宽度小于1080px的设备上显示的图片。有时也会这样

这是网站：（关于“截图”部分）

函数showSlides（）{
如果（window.innerWidth>1080）{
var slideIndex=0；
放映幻灯片（）；
函数showSlides（）{
var i；
var slides=document.getElementsByClassName（“mySlides”）；
对于（i=0；i幻灯片长度）{
slideIndex=1
}
幻灯片[slideIndex-1].style.display=“block”；
设置超时（显示幻灯片，8000）；
}
}
}
addEventListener（'DOMContentLoaded'，function（）{
放映幻灯片（）；
});
addEventListener（'resize'，function（））{
放映幻灯片（）；
});

我希望当你从宽屏调整到1080px或更小时，这个功能会激活。幻灯片会消失，但不会。

---

但是，当您在1080px的屏幕上刷新或访问站点时，它们确实会消失。

删除

放映幻灯片的重新声明，您应该会没事的

function showSlides() {
    if (window.innerWidth < 1080) return;

    let slideIndex = 0;
    const slides = document.getElementsByClassName("mySlides");

    for (let i = 0; i < slides.length; i++) {
        slides[i].style.display = "none";  
    }
    slideIndex++; 

    if (slideIndex > slides.length) {
        slideIndex = 1;
    }

    slides[slideIndex-1].style.display = "block";  
        setTimeout(showSlides, 8000);
    }
}
...

函数showSlides（）{
if（window.innerWidth<1080）返回；
设slideIndex=0；
const slides=document.getElementsByClassName（“mySlides”）；
for（设i=0；i幻灯片长度）{
slideIndex=1；
}
幻灯片[slideIndex-1].style.display=“block”；
设置超时（显示幻灯片，8000）；
}
}
...
在其中添加逻辑，当大小变化低于阈值时，终止间隔


var updateShow=（函数（）{
var slideshowTimer=null
变量slideIndex=-1
返回函数（）{
var slides=document.getElementsByClassName（“mySlides”）；
如果（！slides.length）返回
//如果宽度较大且未运行，则启动它
如果（window.innerWidth>10/*1080*/）{
如果（！幻灯片显示计时器）{
slideshowTimer=window.setInterval（executeIt，1000）
}
}否则{
窗口清除间隔（幻灯片显示计时器）
slideshowTimer=null
}
函数executeIt（）{
如果（滑动索引！=-1）{
幻灯片[slideIndex].style.display=“无”；
}
滑动索引++
如果（slideIndex>=slides.length）{
slideIndex=0
}
幻灯片[slideIndex].style.display=“block”；
}
}
})();
addEventListener（'DOMContentLoaded'，function（）{
updateShow（）；
});
addEventListener（'resize'，function（））{
updateShow（）；
});
.mySlides{
显示：无；
}

为什么要在方法内部重新定义方法？问题是，如果它开始时>1080，并且您调整了大小，那么它已经在运行了。。。。所以只需设置一个内部检查，在设置变量时不运行。我实现了这个，但现在它不再显示图像了？它不工作，我不知道为什么，但我上传了这个，现在它不再显示图像了。我添加了幻灯片，不确定你的问题是什么。
function showSlides() {
    if (window.innerWidth < 1080) return;

    let slideIndex = 0;
    const slides = document.getElementsByClassName("mySlides");

    for (let i = 0; i < slides.length; i++) {
        slides[i].style.display = "none";  
    }
    slideIndex++; 

    if (slideIndex > slides.length) {
        slideIndex = 1;
    }

    slides[slideIndex-1].style.display = "block";  
        setTimeout(showSlides, 8000);
    }
}
...