我把不透明度设置为0的幻灯片仍然可以点击,即使我把指针事件设置为无。基本上我有2张幻灯片在这个幻灯片上,即使我在第一张幻灯片上点击它,它转到第二个幻灯片超链接。Image此图像显示代码正在正确更改指针事件和不透明度,但由于某种原因,当我单击网站,它仍然把我发送到第二个幻灯片超链接。
//programming slideshow
$(function () {
var slide_index = 1;
displaySlides(slide_index);
function nextSlide() {
displaySlides(slide_index++);
}
function prevslide() {
displaySlides(slide_index--);
}
function displaySlides() {
var i;
var slides = document.getElementsByClassName("programming-slides");
if (slide_index > slides.length) { slide_index = 1 }
if (slide_index < 1) { slide_index = slides.length }
for (i = 0; i < slides.length; i++) {
slides[i].style.opacity = 0;
}
slides[slide_index - 1].style.opacity = 1;
for (var i = 0; i < slides.length; i++) {
// If the slide is not visible, set its pointer-events to none
if (slides[i].style.opacity === '0') {
slides[i].style.pointerEvents = 'none';
} else {
// Otherwise, set its pointer-events to auto
slides[i].style.pointerEvents = 'auto';
}
}
}
var next = document.getElementById('programming-next');
next.addEventListener('click', nextSlide);
var prev = document.getElementById('programming-prev');
prev.addEventListener('click', prevslide);
})
1条答案
按热度按时间voase2hg1#
我开始修复它,在幻灯片js的代码中添加了z index,也添加了一些其他css元素,修复了重叠问题,现在所有的功能都正常工作了