<script src="jquery.js" type="text/javascript" charset="utf-8"></script>
<script src="iscroll.js" type="text/javascript" charset="utf-8"></script>
<script src="jquery.lazyload.js" type="text/javascript" charset="utf-8"></script>
<script src="jquery.transit.js" type="text/javascript" charset="utf-8"></script>
jquery.lazyloadはスクロールイベントを監視しているので、
iScrollのスクロールでwindowのscrollを発火させる。
new iScroll('scroller', {
useTransition: true,
onScrollMove: function () {
$(window).trigger('scroll');
}
});
Lazy Load後の表示でデフォルトのアニメーションを使うとMobile Safariではコマ落ちするので、jquery.transitのアニメーションに置き換える。
$('target').lazyload({
effect : 'show',
effect_speed: 0,
appear: function()
{
$(this).css('opacity',0);
},
load: function()
{
$(this).transition({
'opacity': 0.999999
}, 250);
}
});