Merge branch 'feature/shopCoupon' into 'feature/limitProdDetail'

fix coupon



See merge request !428

 {{# coupon}}
 <div class="top-coupon-wrap num{{length}}"{{# shopId}} data-shop="{{.}}"{{/ shopId}}{{# brandId}} data-brand="{{.}}"{{/ brandId}}>
     <div class="coupon-title"></div>
-    <ul class="coupon-list clearfix">
-        {{# list}}
-            <li class="coupon-item" title="{{coupon_name}}">
-                <div class="cp-info">
-                    <em class="price">¥ {{money}}{{#if showUnit}}优惠券{{/if}}</em>
-                    <p class="limit-text">{{coupon_name}}</p>
-                    <p class="term">有效日期：{{couponValidity}}</p>
+    <div class="coupon-list-wrap">
+        <div class="coupon-list clearfix">
+            {{# list}}
+                <div class="coupon-item" title="{{coupon_name}}">
+                    <div class="cp-info">
+                        <em class="price">¥ {{money}}{{#if showUnit}}优惠券{{/if}}</em>
+                        <p class="limit-text">{{coupon_name}}</p>
+                        <p class="term">有效日期：{{couponValidity}}</p>
+                    </div>
+                    <div class="pick-btn" data-id={{coupon_id}} data-money="{{money}}" data-name="{{coupon_name}}" data-time="{{couponValidity}}">点击领取</div>
                 </div>
-                <div class="pick-btn" data-id={{coupon_id}} data-money="{{money}}" data-name="{{coupon_name}}" data-time="{{couponValidity}}">点击领取</div>
-            </li>
-        {{/ list}}
-    </ul>
+            {{/ list}}
+        </div>
+    </div>
     {{#if showNextBtn}}
         <div class="coupon-btn">
             <i class="iconfont pre-btn btn-end">&#xe609;</i>

@@ -8,6 +8,7 @@ var $ = require('yoho-jquery'),
     Dialog = require('../../common/dialog').Dialog;
 
 var $couponWrap = $('.top-coupon-wrap'),
+    $couponList = $couponWrap.find('.coupon-list'),
     $couponItem = $couponWrap.find('.coupon-item'),
     $pickBtn = $couponWrap.find('.pick-btn'),
     $couponBtn = $couponWrap.find('.coupon-btn');
@@ -222,8 +223,8 @@ function couponSlide(num) {
         that.$btns = $couponBtn.children();
     }
 
-    $couponItem.eq(0).animate({
-        'margin-left': -itemWidth * num
+    $couponList.animate({
+        left: -itemWidth * num
     });
 
     that.$btns.removeClass('btn-end');

@@ -17,14 +17,18 @@
         float: left;
     }
 
-    .coupon-list {
+    .coupon-list-wrap {
         width: 800px;
         height: 100%;
         float: right;
-        font-size: 14px;
-        white-space: nowrap;
         overflow: hidden;
+        position: relative;
+    }
+
+    .coupon-list {
+        white-space: nowrap;
         text-overflow: ellipsis;
+        position: absolute;
     }
 
     .coupon-item {
@@ -33,6 +37,7 @@
         margin: 0 11px;
         color: #fff;
         background: #d0021b;
+        font-size: 14px;
         display: inline-block;
         vertical-align: top;
         position: relative;
@@ -109,7 +114,7 @@
             background-image: resolve("product/coupon-title-large.png");
         }
 
-        .coupon-list {
+        .coupon-list-wrap {
             width: 738px;
         }
 
@@ -223,7 +228,7 @@
 }
 
 .min-screen .top-coupon-wrap {
-    .coupon-list {
+    .coupon-list-wrap {
         width: 644px;
     }
 
@@ -245,7 +250,7 @@
     }
 
     &.num1 {
-        .coupon-list {
+        .coupon-list-wrap {
             width: 580px;
         }