jQueryスライダの問題

Question

私が作成しようとしているjqueryスライダにいくつかの問題があります。 JSFで

：jsfiddle.net/0hq91y5v/

私は、各スライドにリンクしようとしている5つのドットのliのリンクを持っています。私は明らかに、各ボタンをクリックするとクラスをactiveDotに変更し、現在のアクティブなボタンからクラスを削除するようにしたいと思います。私はjqueryでこれを試しましたが、うまくいきません。

また、同じメソッドを使用して各ボタンをクリックした後、それぞれのスライドを切り替えるために、いくつかのコードを追加しましたが、これも機能しません。

最後に、私が使用したコードを見て、関連するボタンをクリックしたときにactiveSlideクラスを追加したり削除したりする意味的な方法は、私のようにするのではなく、ボタン？

Answer 1

現在のjQueryコードとマークアップにもいくつかの変更を加える必要があります。

は、このコードは、あなたが期待している動作を実現するのに役立ちます fiddle

を見て、あなたが必要とフェードイン（）やフェードアウト（）を追加することができます。

$(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'); 

    }); 

});