Showing
3 changed files
with
26 additions
and
23 deletions
@@ -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"></span> | 5 | + <a href=""> |
6 | + <span class="bundle-desc">{{description}}</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"> | ||
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"></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 { |
-
Please register or login to post a comment