0

基本的に、jQueryCycleプラグインを使用して複数のスライドショーを含むページを設定しています。各スライドショー('.slideshow')には、ポケットベル('.controls')の形式で独自のナビゲーションがあります。ただし、ポケットベルアイコンをクリックするたびに、すべてのスライドショーでページが次のスライドにフェードインします。問題のスライドショーだけがトランジションを持つようにこれを防ぐにはどうすればよいですか?以下のコードは機能すると思いましたが、機能しません。どのページャーアイコンが選択されているかを表示するにはどうすればよいですか?

私のコードは以下の通りです:

$(document).ready(function(){
$('.slideshow').each(function(){
var $this = $(this), $ss = $this.closest('.slideshow');
var pager = $ss.find('.controls');

$this.cycle({
fx:     'fade',
speed:  'slow',
timeout: 5000,
pager:  pager,
pagerAnchorBuilder: function(idx, slide) {
// return sel string for existing anchor
return '.controls li:eq(' + (idx) + ') a';
}
}); 

});
});

htmlは次のようになりますが、ページに倍数があります。

<div class="slider">
<div class="slideshow">
<a href="#" class="slider-item"><img src="img/temp-featuredwork.png" alt="icon" width="545" height="254" border="0" /></a>
<a href="#" class="slider-item"><img src="img/temp-featuredwork.png" alt="icon" width="545" height="254" border="0" /></a>
 <a href="#" class="slider-item"><img src="img/temp-featuredwork.png" alt="icon" width="545" height="254" border="0" /></a>
  <a href="#" class="slider-item"><img src="img/temp-featuredwork.png" alt="icon" width="545" height="254" border="0" /></a>
</div>
    </div>
     <!--/slider-->
    <ul class="controls">
        <li><a href="#">1</a></li>
        <li><a href="#">2</a></li>
        <li><a href="#">3</a></li>
        <li><a href="#">4</a></li>
     </ul>
4

1 に答える 1

0

この部分は奇妙に思えます:

$('.slideshow').each(function(){
  var $this = $(this), $ss = $this.closest('.slideshow');
  var pager = $ss.find('.controls');

試す

$('.slideshow').each(function(){
var $this = $(this);
var pager = $this.find('.controls');

$this で一致する .slideshow 要素への参照を既に取得しているため、ss は必要ありません。

これが機能しない場合は、HTML のスニペットを投稿するか、http://jsfiddle.netでテストをセットアップして、ここにリンクしてください。

于 2010-07-21T11:01:20.923 に答える