1

私は、他の多くの人と同じように、クリック可能でスタイル設定可能なページネーションを Bootstrap カルーセルで実行したいので、bootstrap の上で追加の jquery プラグイン (例: innerfade) を実行する必要はありません。

この質問（および回答）Bootstrap Carousel Number active iconを使用してショットを撮りましたが、これまでのところサイコロはありません。ここで何が間違っているのかわかりません。

これが私のいじりhttp://jsfiddle.net/adriatiq/V4SBt/です（奇妙なことに、ページネーションはローカルではなくフィドルで機能します）。ご覧のとおり、スライドが進行しても番号付けはスキップされません。

私の悲惨なjsスキルを許してください。

4

2 に答える 2

6

これは私にとってはうまくいきます:) http://jsfiddle.net/4WY6S/6/

<script type="text/javascript">
 var currentPage =0;
 $('#myCarousel').carousel({
         interval: 7000
     })
 $('#carousel-nav a').click(function(q){
    q.preventDefault();
    clickedPage = $(this).attr('data-to')-1;
    currentPage = clickedPage-1;
    $('#myCarousel').carousel(clickedPage);
    });
var pages = $("#carousel-nav a");
var pagesCount = pages.length;
$('#myCarousel').on('slide', function(evt) {
  $(pages).removeClass("active");
  currentPage++;
  currentPage=(currentPage%pagesCount);
  $(pages[currentPage]).addClass("active");
  });
</script>

「前へ」ボタンと「次へ」ボタンのコードは次のとおりです。

<a href="#" onclick="if(currentPage>0){currentPage=((currentPage-2)%3);$('#myCarousel').carousel(currentPage+1);}">PREVIOUS</a> | <a href="#" onclick="if(currentPage<2){$('#myCarousel').carousel(currentPage+1);}">NEXT</a>
于 2012-06-11T13:47:21.077 に答える
4

I've looked into your code. I've added the class based on clicking on the 1,2,3 numbers... But I was unable to do the same for next prev links...

http://jsfiddle.net/V4SBt/1/

I've written the code but its commented... In that code I've getting strange error saying Undefined click event on those link when I tried to listen to those click event.

于 2012-06-11T05:36:07.680 に答える