jquery:指定した画像が読み込まれたら実行
2012.03.28
すべての画像が読み込まれた後にスクリプトを実行する場合は
前回のJS:ロード完了時に実行でほぼ足りてしまうのですが、
指定した画像が読み込まれたときに実行する場合や、
後から画像を読み込む場合には不十分です。


画像ありのRSSを読み込もうと思い、

--------------------------------------------------------------------
$("#rssList img").load(function(){
  // 処理
});
--------------------------------------------------------------------

と書いたのですがブラウザによっては上手くいかず。。

↓こちらのサイトでぴったりのことが記事にされていましたので
参考にさせていただきました。

jqueryで画像のロード完了後に実行 - downstairs lab
http://www.stairsdesign.jp/blog/2011/07/jquery.html


■方法
imagesLoadedというプラグインを使用します。

https://gist.github.com/268257

こちらのサイトからJSファイルをダウンロードして<head>内で読み込み、
--------------------------------------------------------------------

<script type="text/javascript" src="js/imagesLoaded.js"></script>

--------------------------------------------------------------------

loadをimagesLoadedに書き換えれば完了です。
※2013/10/2 $(function(){}); を追加しました。
--------------------------------------------------------------------
$(function(){
  $("#rssList img").imagesLoaded(function(){
    // 処理
  });
});
--------------------------------------------------------------------
| コメント(0)

コメントする

※JavaScriptが有効になっている必要があります