j查询图像滑块故障

Question

当我单击上一个按钮两次时，图片消失，滑块不起作用。

这是我的代码： Jsfiddle link 任何帮助将不胜感激。谢谢。

$(document).ready(function() {
$('.nxt').on('click',function () {
var currentImg = $('.active');
var nextImg = currentImg.next();
if(nextImg.length){
currentImg.removeClass('active').css('z-index, -10');
nextImg.addClass('active').css('z-index',10);
}
});
$('.pre').on('click',function () {
var currentImg = $('.active');
var prevImg = currentImg.prev();
if(prevImg.length){
currentImg.removeClass('active').css('z-index, -10');
prevImg.addClass('active').css('z-index',10);
}
});
});

Answer 1

当调用currentImg.prev();时，它会获取前一个元素，即在您的情况下带有 id="slider" 的"div"元素。 将您的图像包装在div 中，如下所示：-

<div>
<img class="active" src="https://i.pinimg.com/564x/57/ab/87/57ab87058782698945270ad9f734ceb5.jpg">
<img src="https://i.pinimg.com/564x/5f/fe/4c/5ffe4ca66086ec07e64b4a46e0e97026.jpg">
</div>

在这里检查小提琴