jQuery で非同期通信中にローディング画像を表示する方法 | jQuery | 阿部辰也のブログ――人生はひまつぶし。
jQuery で Ajax な非同期通信中に「Now Loading」的な GIFアニメ画像を表示する方法の解説です。 超小ネタですが。 jQuery で非同期通信処理をしている間に「Now Loading」的なアニメーション画像を表示する、というのはよくあるパターンですが、その方法の解説です。 ローディング中の画像を表示するスクリプト 例えば、以下のような html の id="message" の内容を Ajax によって変更したい場合。 <p id="message">ここのメッセージが非同期通信後に変更されます。</p> <form method="GET" action="#"> <input type="button" value="ここをクリックでメッセージ変更" onclick="ChangeMessage();"> </form> この時、function ChangeM
http://neteye.github.com/activity-indicator.html
NETEYE Activity Indicator A jQuery plugin that renders a translucent activity indicator (spinner) using SVG or VML. Features Lightweight script No images required No external CSS Resolution independent Alpha transparency Highly configurable appearance Works in all major browsers Uses feature detection Degrades gracefully Supported Browsers The plugin has been successfully tested in the following b
サムネイルのナビゲーションギャラリー
In this tutorial we are going to create an extraordinary gallery with scrollable thumbnails that slide out from a navigation. We are going to use jQuery and some CSS3 properties […] In this tutorial we are going to create an extraordinary gallery with scrollable thumbnails that slide out from a navigation. We are going to use jQuery and some CSS3 properties for the style. The main idea is to have
jquery loading test
jqueryでファイル読み込みする時に、load()メソッドそのまま使うとローディングしながら中身が表示されてしまうので何か方法ないかと思って見つけた。 早い話が、読み込ませるdivにCSSでdisplay:noneを指定しておけばいいってことだった。 非同期通信されるとajaxSendとajaxCompleteが呼び出される。 コールバック関数ってのがよくわかってなかったんだけど、イベントリスナみたいなものだと言われたらちょっとわかった。というか、こういう使い方してもいいんだろうなと。 $(this).fadeOut("fast", function() { $("#content").show(); }); fadeOutした後に読み込んだファイルの中身を表示してる。dtをクリックしたらddが表示される。これやる前は普通にチェーンでつないでたんだけど、フェードアウトが終わる前に読み込み
[JS]Googleのようなローディングを表示するスクリプト
How to build a Google like Ajax loader: the red loading... bar デモページ Googleのように、AJAXを使用した別コンテンツのローディング時に「Loading content...」と書かれたバーを表示するには、下記のコードを使用します。 ローディングバーのCSS <textarea name="code" class="css" cols="60" rows="5"> #loading{ position: fixed; top: 0; left: 0; z-index: 5000; background-color: red; font-size: 150%; color: white; padding: 2px; } </textarea>
1
リリース、障害情報などのサービスのお知らせ
最新の人気エントリーの配信
処理を実行中です
j次のブックマーク
k前のブックマーク
lあとで読む
eコメント一覧を開く
oページを開く
JavaScript + Ajax 実践サンプル集 - イメージをロード中にアニメーションGIFを表示する
FlashやAjaxで使えるローディングバーを自動で作ってくれるツール｜CSS Lecture
