-
ID:jhB9Jg さんの質問

jQueryのスライドショーのページナビによくある移動するactiveというクラス名。これにアニメーション付けたいんですが、うまく行かなくて困ってます。

.activeになったら動いて取れたら戻る。

例えばbxsliderのexample4。サムネイルのクラスにactiveがあります。
http://zxcvbnmnbvcxz.com/demonstration/slide_in_slide.html

$(function(){
$(’#bx-pager a.active’).animate({opacity: 0.4});
});

これだけだと最初の1個目がアニメーションしてその後は変化なし。

みんなの回答 2 件

ID:NOkBy9 さんの回答

後付けするからさ。
JSじゃなくCSSで設定すりゃいい。

ID:jhB9Jg

IE8以上でやろうと考えてますが、CSS3アニメーション使うのは対応が大変そうです。JSでできるのが一番ですが・・・

ID:FSC2Gt

コメ主だけど、この程度のアニメはIEでは諦めるな俺ならば。
CSSで filter: alpha(opacity=40) だけ指定してやって、
transition は諦める。

ID:/bD9xh さんの回答

そのサンプルだと、jquery.bxslider.jsの1001行目に
$(’.bx-pager-item’).not(’.active’).find(’img’).stop().animate({opacity: ’1’});
$(’.active’).find(’img’).stop().animate({opacity: ’0.4’});
追加。
物凄い雑だけど、これでなるんじゃね?
ってかスライダーくらい自分で作りたまえ

最終更新日:2014-01-09 (4,503 views)

関連するトピックス

ページ上部に戻る