jQueryのAjax初期設定でローディング画像の表示をコントロール

Fotolia_74221185_L

「Ajaxの通信を始める前にローディング画像を出して、alwaysで画像を消すというのをすべての通信時にやるのであれば、$.ajaxSetup()に書いておくのが吉だよね」ということで、何度も作りなおさなくても済むように備忘録的に書きつけておきます。

モダンブラウザとIE8以上、スマホをターゲットとはしていますが、検証はこれからなので、書き換わるかもしれません。あとローディングのクルクル画像自体も透過してしまっていますが、「z-indexを複数設定するのも面倒という」理由により雑に設定しています。とにかく、操作を抑止するレイヤーがあればいいというスタンスです。

jQueryで操作してbodyタグ内にDOMを追加しているので、body内に静的なDOMの記述はしていません。

これならパッと実装できるかなと思います。画像自体は「Loader Generator」で生成しました。こういう感じになります。

cap160520

IE9などは単位(px)を付け忘れると0と同じ扱いをされるので注意です。

スポンサーリンク
  • このエントリーをはてなブックマークに追加

水蕗をフォローする

スポンサーリンク

コメントを残す