lazyloading for pictures

https://raw.github.com/tuupola/jquery_lazyload/master/jquery.lazyload.js

JS地址

<script>
    $(document).ready(function() {
        $("img.lazy").lazyload({
            effect: "fadeIn"
        });;
    });
</script>

  <img  alt="@Model.DefaultPictureModel.AlternateText"  class="faderImage imgProductBox lazy" src="~/Themes/StyleDistrict/Content/images/ajax_loader_big.gif" data-original="@Model.DefaultPictureModel.ImageUrl" style="max-height: 198px" /></a>

首先显示的是src里面的小图片( src="~/Themes/StyleDistrict/Content/images/ajax_loader_big.gif")

当真正渲染的时候。显示(data-original="@Model.DefaultPictureModel.ImageUrl" )里的图片，也可自定义名字

（$("img.lazy").lazyload({ data_attribute : "attr" });只需设置 data_attribute 属性为对应的名称即可. ）

 effect : "fadeIn"   表示动画效果