2012-05-07 11 views
-1

Im new to jQuery、私が達成しようとしているのは、イメージをフェードイン/フェードアウトさせたい場合です。フェードアウトした後、フェードアウトしながらイメージを変更したい新しいsrcに私が望むように正確に働いていません。ここまで私がこれまで持っていたことがあります。どんな助けでも大変助かります。jQueryでフェードイン、フェードインをimgで使用

<img src="images/airport1.jpg" Height="200" Width="500" id="main_pic"/> 
<input id="Button1" type="button" value="button" /> 

<script> 
$(document).ready(function() { 
    $("#Button1").click(function() { 
     changePicture(); 
    }); 
}); 
function changePicture() { 
    $("#main_pic").fadeOut(5000).delay(3500).attr('src', "images/airport2.jpg").fadeIn(5000); 
} 
</script> 
+1

http://jsfiddle.net/v5fqB/あなたは、そのあなたが望むように動作していないと言います。何が起こっていて、それがあなたが期待しているものとどう違うのですか? –

+0

特定の質問をすると、誰もあなたのためにあなたの仕事をするつもりはありません。 – asawyer

+0

イメージを事前にロードしていない場合は、イメージをロードするためにHTTPリクエストを行う必要があるという点で、ソースを変更すると欠点があります。私はあなたがこの投稿でどこに行くのか知っていると思うが、完璧に動かすことができなければ挫折しないでください。 – kevin628

答えて

0

代わりの.delayを使用して、私は新しいイメージをロードし、コールバック内fadeInをやって示唆しています。

function changePicture() { 
    $("#main_pic").fadeOut(5000, function(){ 
     $(this).attr('src', "images/airport2.jpg").fadeIn(5000); 
    }); 
} 

DEMO:

関連する問題