1

http://belmontfeed.com/site/に（非常に生の）テストサイトがあり、左側の写真を制御するために右側に垂直カルーセルを配置しようとしています。

[前へ]/[次へ]ボタンは正常に機能し、通常、カルーセルアイテムをクリックすると、それに関連付けられた写真が読み込まれますが、カルーセルでラップを許可すると、クリックが機能しなくなります。

追加/追加がクリック関数の基になっているカウントを台無しにしているためだと思いますが、私はjQueryにかなり慣れておらず、どこを向いたらよいかわかりません。

完全なコードは、上記のサイトで表示できるはずです。どんな助けでも大歓迎です！

if ( opts.allowWrap !== false ) {
  // prepend and append extra slides so we don't see any empty space when we
  // near the end of the carousel.  for fluid containers, add even more clones
  // so there is plenty to fill the screen
  // @todo: optimize this based on slide sizes
  opts.slides.slice(0, opts.slideCount).clone().css( slideCSS ).appendTo( wrap );
  if ( opts.carouselVisible === undefined )
     opts.slides.slice(0, opts.slideCount).clone().css( slideCSS ).appendTo( wrap );
  opts.slides.slice(0, opts.slideCount).clone().css( slideCSS ).prependTo( wrap );
  if ( opts.carouselVisible === undefined )
     opts.slides.slice(0, opts.slideCount).clone().css( slideCSS ).prependTo( wrap );

  wrap.find('.cycle-slide-active').removeClass('cycle-slide-active');
  opts.slides.eq(opts.startingSlide).addClass('cycle-slide-active');
}

更新：最も直接的なクリック機能コードは次のとおりです。

$('#cycle-2 .cycle-slide').click(function(){ 
    var index = ($('#cycle-2').data('cycle.API').getSlideIndex(this)-8);   
    slideshows.cycle('goto', index); 
});

カウントを8で引くだけのゲットー修正を追加しました（これはプリペンドの数です）が、8に達すると、自動的に1に戻るまで機能を停止します。より持続可能な修正は素敵でしょう...

4

2 に答える 2

1

jqueryの新しい仕様を使用して、次のように呼び出すことができます

$(document).on('click', '.cycle-carousel-wrap > div', function(e) {...});

このように、jqueryは、オブジェクトが変更/追加などされているかどうかに関係なく、毎回オブジェクトを検索します。

お役に立てれば！

于 2013-03-10T20:46:16.857 に答える
0

修正しました！簡単な修正を行い、演算子を「-」から「%」に切り替えることで、必要な結果を得ることができました。動的な数値に設定するには、8 をループ投稿の数を表す変数に交換します。

$('#cycle-2 .cycle-slide').click(function(){ 
    var index = ($('#cycle-2').data('cycle.API').getSlideIndex(this)%8);   
    slideshows.cycle('goto', index); 
});
于 2013-03-11T01:21:52.650 に答える