2012-03-31 18 views
4

私はちょっとした指示を実際に探しています。私はJQueryの新機能ですから、少しばかりです。
しかし、フォームが提出されたときにsomewhatと表示されるフォーム "処理" divがあります。アニメーションGIFの代わりにspin.jsを使用する方法

現時点では、アニメーションGIFを使用して簡単なdivを作成して送信を視覚的に示しています。

<div id="loading">Please wait, your news is being submitted... 
<img src="/-/images/addwalk-loader.gif"/> 

理想的には、私は、フォームが送信された後のアニメーションGIFはIE上でアニメーション化し続けないことを認識していますように、spin.jsを通じて作成さスピナーでアニメーションGIFを交換したいと思います。

唯一の問題は、ドキュメントを見て、私はそれをどのように実装するのか少し分かりません。どんな指針も大変ありがとう!ありがとう!

答えて

8

Janusが指摘しているように現在のオブジェクトを回転させたくない場合は、代わりに新しいSpinnerオブジェクトを作成して、その場所に配置することができます。オプションのリストについては、ドキュメントをチェックしてください!

例:それは作業と

var opts = { 
    color: '#000' 
    //etc etc 
}; 
var spinner = new Spinner(opts).spin(); 
$("#loading").appendChild(spinner.el); 

相続人フィドル:http://jsfiddle.net/vasco/6Ca8Y/

+0

私はjQueryを実行したようにスクリプトを呼び出し、これをjQueryファイルに追加しますか?申し訳ありませんが、おそらく非常に無駄な音ですが、私は確信していません! – shorn

+0

@shorn私は実践的な例を使って答えを更新しました。 – vascop

+0

ああ優秀!私はそれを試してみるのに今は時間がありませんが、今私はそれを解決することができるはずです。私は今夜​​行ったことがあると私はメッセージを返します!ありがとう! – shorn

3

これは本当に簡単です。スピンすべきJQueryオブジェクトで.spin()を呼び出します。停止したい場合は.spin(false)に電話してください。

私はそれを自分で使った。here

1

は、私がカスタマイズし、統合が容易にするより多くのオプションを持っている別のプラグインActivity Indicatorを見つけました。試してみてください:|

+0

ありがとう、私はそれをチェックアウトします! – shorn

関連する問題