loadイベントがwindow要素にバインドされた場合、ドキュメント内のウィンドウ、iframe、オブジェクト、画像など全てのリソースの読み込みが完了したときにイベントが発生します。 load(fn) - jQuery API 1.4.4 日本語リファレンス - StackTrace なるほど。こんな感じか。 $(window).load(function() { hoge(); });
jQueryで、画像読み込み表示には色々な方法はありますが、javascriptの new Image()を使用して表示させる例が多いようです。 new Image()での、画像読み込み表示 jQueryで、画像読み込み表示には色々な方法はありますが、javascriptの new Image()を使用して表示させる例が多いようです。ネットで調べれば沢山の情報がありますが、私の場合の経験を踏まえて記述します。 Image()が使用される理由は、 1. 表示サイズではなく画像の実寸を得ることができる。 2. 画像にアクセスして、ロード完了を知ることができる。 3. ERRORの場合の処理ができる。(余り使用はされていないが、、) 4. Loading中の「Loading画像」など表示させる時に便利。 5. jQueryで画像のロードに適したメソッドがない。(ほとんどが、html text な
ですね。docment.readyです。 この実行は、DOM要素の実行を待ってからという意味になるのですが、必ずしも全てのDOM要素を待たずに実行したいケースもあるかもしれません。たとえば、Javascriptで言う、『window.onload』みたいなあれ。 これだけ、簡単ですね。 jQuery版window.onloadの使用例 あまり出番が無いように思えるjQuery版window.onload。 しかし、Ajaxページ読み込みではかなり有効に使えます。 ページ読み込みの例 id hogeのブロックに、あるURLを読み込む例です。 読み込み完了したら、pにhiddenクラスをあてて、かくしてあげたい、Ajaxページ読み込みの典型的な例です。 悪い例 これでも悪くはないのですが、load実行されて、表示が完了するより速くaddClassが実行されてしまうことがあります。 ちょっと重た
イベント ready() DOMがロードされて操作・解析が可能になったタイミングで関数を実行する。 /* DOMロード完了後に実行 */ $(document).ready(function(){ // ここに実際の処理を記述します。 }); 「onload()」イベントをBODYタグに指定すると動かないので注意。 完全に「onload()」イベントの代わりにはならないので、「onload()」イベントのタイミングで実行したい処理は「jQuery.event.add()」を使う。 /* onloadイベントを追加 */ jQuery.event.add(window, "load", function(){ /* ここに処理を書く*/ }); たくさんイベント使うなら以下のようにちょっと楽する。 /* jQuery.event.add()改善 */ function addOnLoadEv
HOME JavaScript入門 一定時間で繰り返す(setInterval) ここから、JavaScriptのタイマーについて解説していきます。 タイマーは、一定時間毎に動作を繰り返す時などに用いることができます。 スライドショーを作ったり、文字を切り替えたり流したりする時などに使用します。 このページでは文字を一文字ずつ表示する方法について見てみましょう。 setInterval()を使ったタイマーのサンプルスクリプト タイマーには2種類あって、ここではsetInterval()という命令文を使ってみます。 もう一つは次のページで解説します。 setInterval()は、一定時間毎に特定の関数を呼び出します。 では、以下のスクリプトをHTMLのBODY内に記入してみて下さい。 <form name="timer"> <input type="button" value="スタート"
HOME JavaScript入門 一定時間で繰り返す(setTimeout) 前のページではsetInterval()を使ったタイマー設定について見ました。 このページではもう一つのタイマー設定方法、setTimeout()について説明していきます。 setTimeout()を使ったサンプルスクリプト setTimeout()は設定時間後に関数を呼び出す命令文で、 それ自体では繰り返しは起こりません。 例えば以下のスクリプトをHTMLのBODY内に書いてみてください。 3秒後にメッセージが表示されて終わりになります。 <form> <input type="button" value="Timer" onclick="setTimeout('mes()',3000)"> </form> <script> function mes() { alert("3秒経ちました!"); } </sc
忙しい朝もサクッと寝癖直し完了! コードレスでどこでも使えるブラシ型ヘアアイロン「Hair Master」を使ってみた
AJAXで外部通信する際にロード中の表示をするのは一般に多いですが、 Apple製品などで良く使われているクルクルするローディングを手軽にカスタマイズできるライブラリを見つけたのでご紹介します。 「Spin.js」を使うと、ローディングアイコンの ラインの数、太さ、長さ、回転スピードなどを簡単にカスタマイズする事が可能になります。 CSSとJSのみで実装されているので、画像が必要ない構成になっています。 使い方 オプションの引数を設定して、表示させたい位置のidを指定すだけのようです。 var opts = { lines: 12, // The number of lines to draw length: 7, // The length of each line width: 5, // The line thickness radius: 10, // The radius of
当ブログデザインは、IE6以前のブラウザには対応していません。 できれば、お使いのブラウザを新しいものへ更新してください。 Windows Internet Explorer 8: ホーム JavaScriptでページ読み込み中に画像等を表示する方法の紹介です。 下の画像のようなものを読み込み中のみ表示させます。 読み込み完了時の処理にはJavaScriptのonloadを使用します。 そのonloadで読み込みが完了したとき、JavaScriptからスタイルを指定して非表示にします。 今回はHTML、JavaScript、CSSを利用し作成します。 では早速HTMLに書く内容から書き始めます。 赤字は各々で変更してください。(書いてあるURLに飛べばどんな内容か分かると思います) HTML <body onLoad="init()"> <script type="text/javascr
リリース、障害情報などのサービスのお知らせ
最新の人気エントリーの配信
処理を実行中です
j次のブックマーク
k前のブックマーク
lあとで読む
eコメント一覧を開く
oページを開く