用户名 密码 记住我 还未注册?

jquery实现浏览器显示区域加载图片 [技术论坛 - Xoops Engine 专版]

XOOPS China 讨论区 > XOOPS Core (核心) > Xoops Engine 专版 > jquery实现浏览器显示区域加载图片

正在浏览：   1 名游客


 到底部   前一个主题   下一个主题
 [无发表权] 请登录或者注册



xiaoyao
jquery实现浏览器显示区域加载图片
#1
中级会员
注册日期:
2008/3/16 21:35
所属群组：
注册会员
帖子: 70
等级： 7; EXP： 28
HP： 0 / 157
MP： 23 / 1247
离线
这个我不太会命标题，
如，当用户打开浏览器的时候，我们只显示第一屏需要的图片，用户滚动事件时，再加载需要的图片，这样做的好处是页面加载快，说白了就是省钱，载图片耗流量

简单实现方式就这样，可以变出很多的其他功能，如qq空间动态那样的效果，等等

js 代码
加载jquery.js

$(document).ready(function() {
        $(window).displayimg();
        $(window).scroll(function(){
            $(this).displayimg();
        });
    });
    ;(function($){
        $.fn.displayimg = function() {
            var o = $("img[src_init]");
            for(i=0;i<=o.length;i++) {
                if ( o.eq(i).offset().top < ($(window).scrollTop()+document.documentElement.clientHeight) ) 
                $(o.eq(i).attr("src",o.eq(i).attr("src_init"))).removeAttr("src_init");
            }
        }
    })(jQuery);


html

<div>
    <img src="" src_init="c.jpg" />
    <img src="" src_init="c.jpg" />
    <img src="" src_init="c.jpg" />
    <img src="" src_init="c.jpg" />
    <img src="" src_init="c.jpg" />
     多放一点<img>.......
</div>

3/18 17:09
_________________
XOOPS3.0 抢先体验，尽在www.xoyoke.com
工具箱 短消息 Email PDF 书签 打印 举报 回顶部

主题 作者 最后发表
     jquery实现浏览器显示区域加载图片 xiaoyao 3/18 17:09
       回复: jquery实现浏览器显示区域加载图片 ezsky 3/18 17:13
       回复: jquery实现浏览器显示区域加载图片 xiaoyao 3/18 17:20
         回复: jquery实现浏览器显示区域加载图片 swsw007 3/25 22:15

 回顶部   前一个主题   下一个主题

 [无发表权] 请登录或者注册


您可以查看帖子。
您不可发帖。
您不可回复。
您不可编辑自己的帖子。
您不可删除自己的帖子。
您不可发起投票调查。
您不可在投票调查中投票。
您不可上传附件。
您不可不经审核直接发帖。
您不可使用主题类别。
您不可使用HTML语法。
您不可使用签名档。

[高级搜索]