JQueryを使用して画像をゆっくり表示させる

JQueryを使用して画像をゆっくり表示させる

ご覧いただきましてありがとうございます。
今回新規でＨＰを作るにあたり、トップの画像をゆっくりと表示させようと思っています。
そういった画像はFlashで良く見るのですが、Flashを使わずJQueryで作成しようと思っています。
ただ、逆引きのサイトなどを見てもボランクリックで表示やスライドショーの表示方法は載っているのですが
私の理想としている風のはなかなか見つけられません。

詳しい方、ご教授いただけると幸いです。

http://www.wasedasai.net/about

このような風に表示するのが理想です。
ソースを見るとこのサイトもJQueryを使用しているみたいなのですが・・・

No.5 ベストアンサー 回答者： yyr446 回答日時： 2010/09/10 09:41

ご提示のサイトは、jQuery ＋ facebox.js + countdown.js

を使ってますね。トップの画像をゆっくりと表示の部分は
facebox.jsの中に記述してます（本来のfaceboxの仕掛けは現在使ってないみたいですが）


facebox.jsの先頭から、
$(function(){
と始まっています。
これはjQueryのコア機能の一つで、
$(document).ready(function(){});
の省略形です。ページの準備が出来たらfunction(){}
を実行するの意味です。

そして、このfunction()の39行目あたりに
$("img").fadeOut(0).fadeIn(1500);
があります。

これが、全ての<img>要素を0秒でフェードアウトさせて、
1.5秒かけてフェードインさせてます。

この回答へのお礼

とっても分かりやすい回答ありがとうございました。

お礼日時：2010/09/12 01:25

No.4 回答者： fujillin 回答日時： 2010/09/09 17:44

単に表示するだけなら　fadeIn([speed])　でよいのでは？

$element.hide().fadeIn(2000);　みたいな感じ。

speedを変えることで、速度を調節できます。

この回答への補足

ご回答ありがとうございます。
日本語リファレンスだと文字をクリックしてから動作が作動しますが、
クリックしないで、ページを開いたら動作が開始するように設定する場合はどうしたらよいのでしょうか・・・？

補足日時：2010/09/10 00:57

No.3 回答者： yyr446 回答日時： 2010/09/09 17:31

JQueryの

　fadeIn([speed], [callback])
では、だめなんですか？

http://semooh.jp/jquery/api/effects/fadeIn/%5Bsp …

最初非表示にしておいて、fadeInで、じょじょに表示

$(function(){
$("#top_gazo").hide();
$("#top_gazo").fadeIn("slow")
});

No.2 回答者： yamada_g 回答日時： 2010/09/09 16:03

No.1です。

続けてですみません。

fadeTo()の方が希望に近いような気がしたので。

http://semooh.jp/jquery/api/effects/fadeTo/speed …[callback]/

No.1 回答者： yamada_g 回答日時： 2010/09/09 15:50

show関数ではダメなのでしょうか？

http://f32.aaa.livedoor.jp/~azusa/?t=ajax&p=jque …

例としてあげられているサイトは透明度を変更していくやり方ですかね。