AJAXが進行中です。 待って...



通常



... Webアプリケーションがロードされていることをユーザーに示すために、このようなアニメーションGIFが使用されます。



画像



典型的なアプローチは次のとおりです。

1.回転するGIFをコーナーや目立つ場所に表示する

2.ダウンロードを開始します(XHttpRequest&Co.)

3.ダウンロードが完了したら、画像を削除します。



アイデア



カーソルアニメーションを使用して、アプリケーションのビジー状態を表示します。



jQueryでこれを行うのに十分だとしましょう:

$("*").css("cursor", "wait");







カーソルを返す:

$("*").css("cursor", "");







このスニペットは、すべての要素のカーソルの状態を変更します。 ただし、特定のオブジェクトに限定してみませんか?



$(".__").css("cursor", "wait");











長所



*マークアップ構造に変更はありません

*外部要素は含まれません(ただし、独自の* .curファイルを使用できます。 信頼できるソースは、この機能がすべての最新のブラウザーでサポートされていると報告しています)

*とても直感的



短所



*ブラウザがフリーズしているように見えます(ただし、非標準のカーソルを使用している場合は、非常に識別しやすいです)

*異なるOSでは、外観が異なります(ちなみに、これはマイナスとプラスの両方です)



PS:プリローダーを探しているときに、誤ってwww.loadinfo.netというサイトを見つけました。 そこで、美しいプリローダーを自分で生成できます=)



編集:

ここでは、例えば、そのようなことに関して、それは非常に適切に見えるでしょう:

www.extjs.com/deploy/dev/examples/desktop/desktop.html



編集2:

実際、このカーソルは待機よりも優れています。

$("*").css("cursor", "progress");






All Articles