回答編集履歴

2 説明追記

tkturbo

tkturbo score 5174

2016/03/29 14:18  投稿

Windows7 × chrome 49.0.2623.87 mです。
通常は
1.slideクラスのdivにactiveクラスを追加する
2.アニメーションでスライドインしてくる予定のdivからactiveクラスを削除する
3.アニメーションが開始され、次のスライドがスライドインする
となるようですが、私の環境でも4<==>1間の動きのみ1->3->2の順で動いているようです。
いろいろいじってみた結果、下記のように修正すると4<==>1間の動きも1->2->3の順で動くようになりましたが、理屈がついていかぬ。。。
```
onSliderLoad:function(currentIndex){
   $('.slide').removeClass('active');
   $('.slide_body > div:nth-child(4n+1)').addClass('active'); // <=
},
onSlideBefore: function($slideElement, oldIndex, newIndex){
   var new_i = newIndex%4;       // <=
   var nth = '4n+' + (new_i + 1);   // <=
```
```
。。。おそらくスライド4枚なのに3の倍数で処理しようとしていたのが問題だったのかなぁ。
1 ソースの欠落分を追加

tkturbo

tkturbo score 5174

2016/03/29 14:16  投稿

Windows7 × chrome 49.0.2623.87 mです。
通常は
1.slideクラスのdivにactiveクラスを追加する
2.アニメーションでスライドインしてくる予定のdivからactiveクラスを削除する
3.アニメーションが開始され、次のスライドがスライドインする
となるようですが、私の環境でも4<==>1間の動きのみ1->3->2の順で動いているようです。
いろいろいじってみた結果、下記のように修正すると4<==>1間の動きも1->2->3の順で動くようになりましたが、理屈がついていかぬ。。。
```
onSliderLoad:function(currentIndex){  
   $('.slide').removeClass('active');  
   $('.slide_body > div:nth-child(4n+1)').addClass('active'); // <=  
},  
onSlideBefore: function($slideElement, oldIndex, newIndex){
   var new_i = newIndex%4;
   var nth = '4n+' + (new_i + 1);
   var new_i = newIndex%4;       // <=
   var nth = '4n+' + (new_i + 1);   // <=
```

思考するエンジニアのためのQ&Aサイト「teratail」について詳しく知る