img lazyload

-var $ = require('jquery');
+/**
+ * Boys JS
+ * @author xuqi/liuyue
+ * @date: 2015/7/15
+ */
+
+var $ = require('jquery'),
+    lazyLoad = require('./common/lazyload');
+
+//lazyload
+lazyLoad();
 
 //点击首页汉堡menu图标，滑出侧栏导航
 $('.nav-btn').on('click', function(event) {
@@ -31,4 +41,4 @@ $('.sub-nav').each(function() {
         $('.sub-nav').removeClass('show');
         event.stopPropagation();
     });
-})
\ No newline at end of file
+});
\ No newline at end of file

+/**
+ * lazyload
+ * @author: xuqi(qi.xu@yoho.cn)
+ * @date: 2015/6/25
+ */
+var $ = require('jquery');
+
+require('lazyload');
+/**
+ * 为指定imgs添加lazyload效果,未指定imgs则为所有img.lazy添加lazyload效果
+ * @params imgs lazyload的图片
+ * @params options lazyload效果选项
+ */
+module.exports = function(imgs, options) {
+    var setting = {
+        effect : 'fadeIn',
+        effect_speed: 10,
+        placeholder: 'data:image/gif;base64,R0lGODlhAQABAJEAAAAAAP///93d3f///yH5BAEAAAMALAAAAAABAAEAAAICVAEAOw==',
+        skip_invisible: false
+    }, $imgs, argsLength = arguments.length;
+    
+    //分解参数
+    (function seperateOptions() {
+        switch (argsLength) {
+            case 0:
+                $imgs = $('img.lazy');
+                break;
+            case 1:
+                if (imgs instanceof $) {
+                    //img
+                    $imgs = imgs;
+                } else {
+                    $imgs = $('img.lazy');
+                    $.extend(setting, imgs);
+                }
+                break;
+            case 2:
+                $imgs = imgs;
+                setting = $.extend(setting, options);
+                break;
+        }
+    }());
+
+    $imgs.lazyload(setting);
+};
\ No newline at end of file

@@ -5,7 +5,7 @@
             {{# list}}
             <li>
                 <a href="{{url}}">
-                    <img class="lazy" data-original="{{img}}" src="{{img}}" alt="">
+                    <img class="lazy" data-original="{{img}}" alt="">
                 </a>
             </li>
             {{/ list}}

 {{> common/floor_header_more}}
 <div class="creative-life">
     <a class="banner" href="{{url}}">
-        <img src="{{banner}}">
+        <img class="lazy" data-original="{{banner}}">
     </a>
     <ul class="classify-list clearfix">
         {{# classify}}
             <li class="classify">
                 <a href="{{url}}">
                     <div class="classify-logo">
-                        <img class="lazy" src="{{img}}">
+                        <img class="lazy" data-original="{{img}}">
                     </div>
                     <p class="classify-name">{{name}}</p>
                 </a>

@@ -4,7 +4,7 @@
         <li class="brand">
             <a href="{{url}}">
                 <div class="brand-logo">
-                    <img class="lazy" src="{{img}}">
+                    <img class="lazy" data-original="{{img}}">
                 </div>
                 <p class="brand-name">{{name}}</p>
             </a>

 {{> common/floor_header}}
 <div class="plus-star">
     <a href="{{url}}">
-        <img src="{{img}}">
+        <img class="lazy" data-original="{{img}}">
     </a>
 </div>
\ No newline at end of file