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(){
// 処理
});
});
--------------------------------------------------------------------
前回の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(){
// 処理
});
});
--------------------------------------------------------------------
コメントする