1

スライドショーに非常に似た写真家向けの機能をコーディングしています。この効果を実現するために、jQuery serialScroll プラグイン (scrollTo プラグインに便乗) を使用することにしました。コードは、 serialScroll デモ ページのスライドショーに基づいています。これは、私が探していた機能とほとんど同じです。

コードは正常に動作していますが、もう 1 つの効果を達成したいと考えています。可能であれば、スライドショーのアイテム (私の場合は<li>要素) をデフォルトで半透明にして、現在の (または「アクティブ」または「選択された」) アイテムのみを 100% の不透明度で表示したいと考えています。

CSS で透明度を簡単に制御できますが、serialScroll がアニメーション化した最後のアイテムを追跡するのに苦労しています。クラスを与えたり、他のアクションを実行したりできるように、jQuery を介して現在「アクティブな」アイテムと対話するにはどうすればよいですか?

4

1 に答える 1

1

これはさまざまな方法で行うことができます。タグに属性を追加する<li>か、次のようにクラスを使用できます。

<ul>
<li class="active">test1</li>
<li>test2</li>
<li>test3</li>
</ul>

jQuery でこのコードを使用すると、アクティブな要素を変更できます。

$('ul li').click( function () {
$(this).parent().children().removeClass('active');
$(this).addClass('active');
});

これでアクティブなものをつかむことができます

$('ul li.active').html()
于 2011-03-09T07:17:51.190 に答える