0

ユーザーがマウスをサムネイルの上に置くたびに、divの画像を別の画像に変更する次のjavascriptコードがあります。

私の質問は、フェードイン効果を適用して画像の変化を良くするにはどうすればよいですか?

ありがとう

JS:

$('#thumbs').delegate('img', {
mouseover: function(){
    $('.mainImage').attr('src',$(this).attr('src').replace('thumb','image'));
    var $this = $(this),
    index = $this.index();
    $("#thumbs img").removeClass('thumbSelected');
        $this.addClass('thumbSelected');
}});

PHP:

<div id="thumbs">
<img class="thumbSelected" src="http://www.tahara.es/images/<?php echo $row2[thumb1]; ?>.jpg"  /><br />
<img src="http://www.tahara.es/images/<?php echo $row2[thumb2]; ?>.jpg"  /><br />
<img src="http://www.tahara.es/images/<?php echo $row2[thumb3]; ?>.jpg"  />
</div>


<div class="mainImage magnify">
<div class="large"></div><a href="http://www.tahara.es/images/<?php echo $row2[image1]; ?>.jpg" rel="lightbox" title="<?php echo $row2[name]; ?>">
<img class="mainImage small" src="http://www.tahara.es/images/<?php echo $row2[image1]; ?>.jpg" />
</a>
</div>
4

2 に答える 2

1

あなたの例では、私は信じています:

$('#big-image img').fadeIn(300);

動作します。

そうでない場合は、次のとおりです。

$('#imgid').fadeIn(300);

または:

$('#.classname').fadeIn(300);
于 2013-02-17T03:47:36.593 に答える
0

Jquery animate をチェックしてください.. http://api.jquery.com/animate/ デュレーション、イージング (おそらく欠けているもの) および完了コールバック (不透明度を上げるなど、最初のアニメーションが完了したときに追加のアニメーションを追加する) を構成できます。 0.8 から 1)

それは本当にあなたがそれをどのように見せたいかの問題ですが、アニメートはフェードインよりもうまくいくでしょう

于 2013-02-17T04:55:32.933 に答える