实例代码“Ctrl+/”提示“F11/ESC”全屏 返回 格式化 恢复 运行
​x
 
1
<!DOCTYPE html>
2
<html>
3
    <head>
4
        <meta content="text/html;charset=utf-8" http-equiv="Content-Type" />
5
        <script type="text/javascript" src="https://ku.shouce.ren/libs/jquery/1/jquery1.7.2.min.js">
6
        </script>
7
        <script src="//ku.shouce.ren/libs/lazyload/1.7.2/js/jquery.lazyload.min.js">
8
        </script>
9
    </head>
10
    <body>
11
        <div class="main">
12
            <div class="inwrap">
13
                <h1>jQuery Lazy Load 图片延迟加载
14
                </h1>
15
                <h2>Basic Options 基础示例
16
                </h2>
17
                <div class="example content">
18
                    <img src="//ku.shouce.ren/libs/lazyload/1.7.2/img/grey.gif" data-original="//ku.shouce.ren/libs/lazyload/1.7.2/img/bmw_m1_hood.jpg" width="765" height="574" alt="BMW M1 Hood">
19
                    <img src="//ku.shouce.ren/libs/lazyload/1.7.2/img/grey.gif" data-original="//ku.shouce.ren/libs/lazyload/1.7.2/img/bmw_m1_side.jpg" width="765" height="574" alt="BMW M1 Side">
20
                    <img src="//ku.shouce.ren/libs/lazyload/1.7.2/img/grey.gif" data-original="//ku.shouce.ren/libs/lazyload/1.7.2/img/viper_1.jpg" width="765" height="574" alt="Viper 1">
21
                    <img src="//ku.shouce.ren/libs/lazyload/1.7.2/img/grey.gif" data-original="//ku.shouce.ren/libs/lazyload/1.7.2/img/viper_corner.jpg" width="765" height="574" alt="Viper Corner">
22
                    <img src="//ku.shouce.ren/libs/lazyload/1.7.2/img/grey.gif" data-original="//ku.shouce.ren/libs/lazyload/1.7.2/img/bmw_m3_gt.jpg" width="765" height="574" alt="BMW M3 GT">
23
                    <img src="//ku.shouce.ren/libs/lazyload/1.7.2/img/grey.gif" data-original="//ku.shouce.ren/libs/lazyload/1.7.2/img/corvette_pitstop.jpg" width="765" height="574" alt="Corvette Pitstop">
24
                </div>
25
            </div>
26
        </div>
27
        <script>
28
            $('img').lazyload();
29
        </script>
30
    </body>
31
</html>
32
​