javascriptで擬似ローディングを実装してみた
チャオ！みんな元気？オレッちはすこぶる元気。 ところでみんなFlash好き？今はキライでも好きな時期はあったはずだろ？ そうだろ？照れなくていいよ。 で、Flash作る時って必ずローディングバー入れただろ？そうだろ？わかってるよ。 昨日天一でこってり食べただろ？ そんなローディングをjQueryを使って実装してみたわけ。 当然、擬似ローディングだけどね。 ちょっとのぞいていきなよ。 まずはページ読み込み時のフェードインの説明するよ このサイトはページ読み込み時と<a>要素クリック時にフェードイン・フェードアウトする<div>要素を入れてるわけ。 図で説明するとこんな感じ。 この図の<div id="fade">はページ全体を#FFFで覆っているのね。それを消したり出したりしてるわけ。 でそのスクリプトはこんな感じ。 ※参考：ページ遷移時にフェードイン・フェードアウト « kojilow B
kojilow Blog | ページ遷移時にフェードイン・フェードアウト
Re:designのサイトで設置した、jQueryを使用してページ遷移時にフェードイン・フェードアウトさせる方法 //インラインCSSで#wrapper{display;block;}を追加 $(‘head’).append(‘<style type=”text/css”>#wrapper{display;none;}</style>’); $(function(){ //読み込み時にフェードイン $(‘#wrapper’).fadeIn(1000); //aタグクリック時にフェードアウト実行 $(‘#navi a, a.windowFade’).click(function(){ var url = $(this).attr(“href”); $(‘#wrapper’).animate({“opacity”:0},1000,function(){ location.href = url;
1
リリース、障害情報などのサービスのお知らせ
最新の人気エントリーの配信
処理を実行中です
j次のブックマーク
k前のブックマーク
lあとで読む
eコメント一覧を開く
oページを開く
