『jQuery 最高の教科書』という参考書のp.135のスライドショー実装について質問があります。
添付するコードの、jQuery記述の1番最後の文『currentIndex = nextIndex;』の意味が分かりません。
現在のスライドのインデックス番号を更新する1文です。
例えば『1+1=2』だとか、『1+2=3』という文があったとして、これは数式として理解できます。
ですが、先ほどの『currentIndex = nextIndex;』というのは、『0=1』と言っているようなもので、意味が分かりません。
どなたか分かりやすく教えて下さい。
この参考書のサンプルサイトがありますので、どのようなスライドショーかご確認下さい。
https://www.shiftbrain.com/book/jquery/sample/chapter05/01/
該当のソースコード
html
1<div class="slideshow"> 2 <img src="slide1.jpg"> 3 <img src="slide2.jpg"> 4 <img src="slide3.jpg"> 5 <img src="slide4.jpg"> 6</div>
css
1.slideshow { 2 position: relative; 3} 4 5.slideshow img { 6 position: absolute; 7 display: none; 8}
jQuery
1var $slides = $('.slideshow').find('img'), 2 slideCount = $slides.length, /*4つ画像があるので、4が格納されている*/ 3 currentIndex = 0; 4 /*現在表示しているスライドが全体のうち何番目かを表すために使用する。0番目の画像を最初に表示したいので、0を設定している。*/ 5 6$slides.eq(currentIndex).fadeIn(); 7setInterval(showNextSlide,2000); 8 9function showNextSlide(){ /*オリジナルの関数*/ 10 var nextIndex = (currentIndex + 1) % slideCount; 11 $slides.eq(currentIndex).fadeOut(); 12 $slides.eq(nextIndex).fadeIn(); 13 currentIndex = nextIndex; /*←ここがこの質問の主題*/ 14}
回答2件
あなたの回答
tips
プレビュー
バッドをするには、ログインかつ
こちらの条件を満たす必要があります。
2021/04/27 10:59