Authored by 郭成尧

swiper-detail-adjust

@@ -2,19 +2,19 @@ @@ -2,19 +2,19 @@
2 <div class="bundle-nav"> 2 <div class="bundle-nav">
3 <div class="bundle-title">{{title}}</div> 3 <div class="bundle-title">{{title}}</div>
4 <div class="bundle-right"> 4 <div class="bundle-right">
5 - <span class="bundle-desc">{{description}}</span>  
6 - <span class="iconfont">&#xe604;</span> 5 + <a href="">
  6 + <span class="bundle-desc">{{description}}</span>
  7 + <span class="iconfont">&#xe604;</span>
  8 + </a>
7 </div> 9 </div>
8 </div> 10 </div>
9 <div class="bundle-product"> 11 <div class="bundle-product">
10 <div class="swiper-wrapper"> 12 <div class="swiper-wrapper">
11 {{# product_list}} 13 {{# product_list}}
12 - <div class="swiper-slide">  
13 - <div class="plus plus-{{@index}}"><span class="iconfont">&#xe624;</span></div>  
14 - <div class="product-box">  
15 - <a href="{{href}}"><img src="{{img}}" alt=""></a>  
16 - <div class="bundle-price">{{price}}</div>  
17 - </div> 14 + <div class="swiper-slide plus plus-{{@index}}"><span class="iconfont">&#xe624;</span></div>
  15 + <div class="swiper-slide product-box">
  16 + <a href="{{href}}"><img src="{{img}}" alt=""></a>
  17 + <div class="bundle-price">{{price}}</div>
18 </div> 18 </div>
19 {{/ product_list}} 19 {{/ product_list}}
20 </div> 20 </div>
@@ -8,6 +8,7 @@ var $ = require('yoho-jquery'), @@ -8,6 +8,7 @@ var $ = require('yoho-jquery'),
8 $(function() { 8 $(function() {
9 new Swiper('.bundle-product', { 9 new Swiper('.bundle-product', {
10 freeMode: true, 10 freeMode: true,
11 - width: 130 11 + slidesPerView: 4,
  12 + lazyLoading: true
12 }); 13 });
13 }); 14 });
@@ -38,23 +38,25 @@ @@ -38,23 +38,25 @@
38 38
39 .swiper-wrapper { 39 .swiper-wrapper {
40 height: 295px; 40 height: 295px;
41 - width: 100%;  
42 41
43 - .swiper-slide {  
44 - .plus {  
45 - float: left;  
46 - margin-top: 88px;  
47 - margin-right: 10px;  
48 - color: #b0b0b0;  
49 - } 42 + .plus {
  43 + margin-top: 88px;
  44 + margin-left: 5px;
  45 + margin-right: 5px;
  46 + color: #b0b0b0;
  47 + width: 30px !important;
  48 + }
50 49
51 - .plus-0 {  
52 - visibility: hidden;  
53 - } 50 + .plus-0 {
  51 + visibility: hidden;
  52 + }
54 53
55 - .product-box {  
56 - width: 155px;  
57 - float: left; 54 + .product-box {
  55 + width: 155px;
  56 + float: left;
  57 +
  58 + a {
  59 + display: inline-block;
58 } 60 }
59 61
60 .bundle-price { 62 .bundle-price {