如何解决如果JS中的光标悬停滑块,则暂停幻灯片放映
我正在做一个学校项目,需要根据WCAG标准暂停滑块。当将鼠标悬停并停在其上时,可以尝试给我发短信给我添加到JS文件中的滑块吗?
我的HTML:
<div class="slideshow-container">
<div class="mySlides fade">
<div class="numbertext">1 / 3</div>
<a href=#stranka><img src="Pic/industry-3775533_1920.jpg" alt="kamenný lom" style="width:100%"></a>
<div class="text-block">
<h4>Lorem ipsum dolor sit amet</h4>
<p>Lorem ipsum dolor sit amet,consectetuer adipiscing elit. Ut tempus purus at lorem. Neque porro quisquam est,qui dolorem ipsum quia dolor sit amet,consectetur,adipisci velit,sed quia non numquam eius modi tempora incidunt ut labore et dolore magnam aliquam quaerat voluptatem. Fusce suscipit libero eget elit. Integer vulputate sem a nibh rutrum consequat. Duis condimentum augue id magna semper rutrum. Aliquam erat volutpat. Nullam sapien sem,ornare ac,nonummy non,lobortis a enim. Aenean vel massa quis mauris vehicula lacinia. Morbi leo mi,</p>
</div>
<div class="text-pic">
<img src="Pic/Letanne.png" alt="pic" style="width:200px; border-radius: 2pt; border: 1.5px solid black;">
<h1>Štěrk Lettane</h1>
<p>Lorem ipsum dolor sit amet r sit amet </p>
<button class="button"><strong>Zobrazit detaily</strong></button>
</div>
<div class="text">Jeden z našich kamenných lomů.</div>
</div>
<br>
<script src="myscripts.js">
</script>
</div>
我的JS:
var slideIndex = 0;
showSlides();
function showSlides() {
var i;
var slides = document.getElementsByClassName("mySlides");
var dots = document.getElementsByClassName("dot");
for (i = 0; i < slides.length; i++) {
slides[i].style.display = "none";
}
slideIndex++;
if (slideIndex > slides.length) {slideIndex = 1}
for (i = 0; i < dots.length; i++) {
dots[i].className = dots[i].className.replace(" active","");
}
slides[slideIndex-1].style.display = "block";
dots[slideIndex-1].className += " active";
setTimeout(showSlides,8000);
}
版权声明:本文内容由互联网用户自发贡献,该文观点与技术仅代表作者本人。本站仅提供信息存储空间服务,不拥有所有权,不承担相关法律责任。如发现本站有涉嫌侵权/违法违规的内容, 请发送邮件至 dio@foxmail.com 举报,一经查实,本站将立刻删除。