jQuery滑块的问题

我尝试制作的jquery滑块有一些问题

在jsf上：

我有五个点li链接，我正试图链接到每张幻灯片。很明显，我想这样做，单击每个按钮将类更改为activeDot，并从当前的活动按钮中删除该类。我在jquery中尝试过这个，但它不起作用

我还添加了一些代码，通过切换每个按钮的activeSlide类，在使用相同方法单击每个按钮后，尝试在不同的幻灯片之间淡入淡出，但这也不起作用

---

最后，看看我使用的代码，单击相关按钮后添加和删除activeSlide类的更好/更具语义的方法是什么，而不是像我一样为每个按钮创建函数？

您还需要对当前的jQuery代码和标记进行一些更改

看看

这段代码将帮助您实现预期的行为，您可以根据需要添加fadeIn（）和fadeOut（）

$(document).ready(function() {

    var activeSlide = $('#homeSlider > .activeSlide');
    var activeDot = $('#homeSliderNav > ul > li.activeDot');

    $('#homeSliderNav > ul > li').click(function() {
        $('#homeSliderNav > ul > li').removeClass('activeDot');
        $(this).addClass('activeDot');
        $('.slide').removeClass('activeSlide');
        var slide = this.getAttribute('data-id');
        $('#' + slide).addClass('activeSlide');

    });

});

---

你介意用吗？我不想用pluginThanks来写这篇文章。我曾尝试将您的代码添加到我的站点，但我已将id切换到类，因此我没有将id使用两次（用于幻灯片和按钮），但我无法使其正常工作。在jsf:jsfiddle.net/0hq91y5v/1/中，在标记中不能使用单个id两次，这是一条经验法则。签出定义和使用部分。正如我在描述中已经提到的，您也需要对标记进行一些更改。不，我的意思是您已经在JSFIDLE中使用了两次id。您已将id=“homeSlideOne”应用于幻灯片本身及其按钮。然后，我尝试将每个项目的id更改为class，但现在滑块不起作用。查看我刚刚发布的JSFIDLE链接。很抱歉，我已经更新了它。不幸的是，我无法看到我以不同的方式提供给您的任何代码。这里是最新的一条：谢谢。现在工作很好