Showing
3 changed files
with
12 additions
and
9 deletions
@@ -2,20 +2,20 @@ | @@ -2,20 +2,20 @@ | ||
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 | + <a href=""> | ||
5 | <span class="bundle-desc">{{description}}</span> | 6 | <span class="bundle-desc">{{description}}</span> |
6 | <span class="iconfont"></span> | 7 | <span class="iconfont"></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"></span></div> | ||
14 | - <div class="product-box"> | 14 | + <div class="swiper-slide plus plus-{{@index}}"><span class="iconfont"></span></div> |
15 | + <div class="swiper-slide product-box"> | ||
15 | <a href="{{href}}"><img src="{{img}}" alt=""></a> | 16 | <a href="{{href}}"><img src="{{img}}" alt=""></a> |
16 | <div class="bundle-price">¥{{price}}</div> | 17 | <div class="bundle-price">¥{{price}}</div> |
17 | </div> | 18 | </div> |
18 | - </div> | ||
19 | {{/ product_list}} | 19 | {{/ product_list}} |
20 | </div> | 20 | </div> |
21 | </div> | 21 | </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,14 +38,13 @@ | @@ -38,14 +38,13 @@ | ||
38 | 38 | ||
39 | .swiper-wrapper { | 39 | .swiper-wrapper { |
40 | height: 295px; | 40 | height: 295px; |
41 | - width: 100%; | ||
42 | 41 | ||
43 | - .swiper-slide { | ||
44 | .plus { | 42 | .plus { |
45 | - float: left; | ||
46 | margin-top: 88px; | 43 | margin-top: 88px; |
47 | - margin-right: 10px; | 44 | + margin-left: 5px; |
45 | + margin-right: 5px; | ||
48 | color: #b0b0b0; | 46 | color: #b0b0b0; |
47 | + width: 30px !important; | ||
49 | } | 48 | } |
50 | 49 | ||
51 | .plus-0 { | 50 | .plus-0 { |
@@ -55,6 +54,9 @@ | @@ -55,6 +54,9 @@ | ||
55 | .product-box { | 54 | .product-box { |
56 | width: 155px; | 55 | width: 155px; |
57 | float: left; | 56 | float: left; |
57 | + | ||
58 | + a { | ||
59 | + display: inline-block; | ||
58 | } | 60 | } |
59 | 61 | ||
60 | .bundle-price { | 62 | .bundle-price { |
-
Please register or login to post a comment