スポンサー
あちこちで見かける
スクロールに応じてふわっと画像を読み込むjs。
ページの読み込みも若干早くなるとのことなので試しに導入。
2013/10 ページの読み込みが早くなるとの情報で導入していましたが、体感的にページ読み込み時、なんとなく「スクロールの感覚がカクカクしてる」なーっと思っていました。
最近、よく覗くウェブシュフさんの【Wordpress高速化日記】.htaccessの書き換え効果絶大、Lazy Load系プラグインの停止、SNSボタン削減も効果あり のエントリーを読んで停止を決意。
後に、ゆめぴょんのさんの【WordPressまとめ】高速化はSEO対策に！17のブログ表示速度アップ術 も読んで確信。カクカク感が全くなくなって”スクロールの感覚がおかしかった”感じがなくなって良かったと思います。
ほんとに、思い切って減らす選択も時には必要ですねー
wordpress用にプラグインがあるので導入自体は簡単ですが・・・
このページの目次
発生した問題点と解決法
①サイドバーやフッターなどの画像（バナーなど）には適用させたくない
|
1 2 3 4 5 6 7 8 9 10 |
jquery-image-lazy-loading/jq_img_lazy_load.phpを編集 <script type="text/javascript"> jQuery(document).ready(function($){ if (navigator.platform == "iPad") return; jQuery("<span style="color: #ff0000;">img</span>").lazyload({ effect:"fadeIn", placeholder: "$placeholdergif" }); }); </script> |
の赤色部分に「適用させる箇所のクラス名（もしくはID)をプラス。
EX)
|
1 2 3 4 5 6 7 8 9 |
<script type="text/javascript"> jQuery(document).ready(function($){ if (navigator.platform == "iPad") return; jQuery("<span style="color: #ff0000;">.post img</span>").lazyload({ effect:"fadeIn", placeholder: "$placeholdergif" }); }); </script> |
②jQueryベースのプログラムなのでprototypeベースのLightbox2ががっちり？衝突。
テーマのheader.phpを編集。
<?php wp_head()?>の下あたりに
|
1 |
<script>jQuery.noConflict();var j$ = jQuery;</script> |
を挿入。
上記の設定、クラス名追加の部分、プラグインのアップデートでデフォルトに戻る模様。
スポンサー
ニュースレターを購読する
