JavaScript Test

jQueryでカルーセルを作る際に以下のコード（html、css、JavaScript）でプレビューしてみるのですが、左矢印が消える処理は出来ているものの最後のスライドになっても右矢印が消えずに永遠にスライドできてしまいます。何がいけないのか分かりません。どなたか教えていただけると嬉しいです。分かりやすいコードやコメントが出来ていないとは思いますがよろしくお願いします。 ```html JavaScript Test

< >

``` ```css .box { width:400px; height:400px; } .img1 { background-color: blue; } .img2 { background-color: red; } .img3 { background-color: yellow; } .img4 { background-color: skyblue; } /*カルーセルのひょうじ範囲指定*/ .carousel { position:relative; overflow:hidden; width:400px; height:400px; margin:0 auto; } /*矢印のスタイル*/ .carousel-control { display:block; width:30px; height:50px; background-color:#f0f0f0; color:#333; text-align:center; line-height:45px; text-decoration:none; font-size:2rem; opacity:.5; /*透明度をふわっと変える*/ transition: opacity .15s; } /*マウスが乗ったら濃くする*/ .carousel-control:hover { opacity:.8; } /*コントルールボタンの位置*/ /*左矢印*/ .carousel-control-prev { position:absolute; left:0; top:200px; text-indent:-2px; } /*右矢印*/ .carousel-control-next { position:absolute; right:0; top:200px; text-indent:2px; } .slides { position:absolute; top:0; left:0; /*横１枚一続き写真にする*/ width:99999px; /*ul liのデフォルトスタイル消去*/ margin:0; padding:0; list-style:none; } /*各写真を横つなぎにする*/ .slides li { float:left; width:400px; height:400px; } ``` ```JavaScript //スライド１枚当たりの幅を取得 var slideWidth = 400; //現在表示中のスライドを数える（０から） var currentSlide = 0; //スライドの全枚数 var numSlides; function showSlide(index) { if (index === 0) { $(".carousel-control-prev").hide(); } else { $(".carousel-control-prev").show(); } if(index === numSlides -1){ $(".carousel-control-next").hide(); }else { $(".carousel-cotrol-next").show(); } $(".slides").stop().animate({ left: -slideWidth * currentSlide + "px" }, 600); } $(document).ready(function() { //スライダーすべての枚数 numSlides = (".slides > li").length; //最初のスライドを表示 showSlide(currentSlide); // 左矢印がクリックされたら1つ前のスライドを表示 $(".carousel-control-prev").click(function() { currentSlide--; showSlide(currentSlide); return false; }); // 右矢印がクリックされたら1つ後のスライドを表示 $(".carousel-control-next").click(function() { currentSlide++; showSlide(currentSlide); return false; }); }); ```

	@@ -1,1 +1,1 @@
1	- jQuery カルーセルついて
1	+ jQuery カルーセルのスライドボタンが消えずに永遠にスライドできてしまう....

質問編集履歴