code viewed by liangzhifeng
Showing
4 changed files
with
44 additions
and
7 deletions
@@ -16,7 +16,9 @@ var consultFooterEle = document.getElementById('consult-content-footer'), | @@ -16,7 +16,9 @@ var consultFooterEle = document.getElementById('consult-content-footer'), | ||
16 | navtabHammer = navtabEle && new Hammer(navtabEle), | 16 | navtabHammer = navtabEle && new Hammer(navtabEle), |
17 | 17 | ||
18 | gotoConsultEle = document.getElementById('goto-consult'), | 18 | gotoConsultEle = document.getElementById('goto-consult'), |
19 | - gotoConsultHammer = gotoConsultEle && new Hammer(gotoConsultEle); | 19 | + gotoConsultHammer = gotoConsultEle && new Hammer(gotoConsultEle), |
20 | + | ||
21 | + $gotoConsult = $('#goto-consult'); | ||
20 | 22 | ||
21 | 23 | ||
22 | 24 | ||
@@ -77,4 +79,22 @@ if (gotoConsultHammer) { | @@ -77,4 +79,22 @@ if (gotoConsultHammer) { | ||
77 | gotoConsultHammer.on('tap', function() { | 79 | gotoConsultHammer.on('tap', function() { |
78 | location.href = $(gotoConsultEle).find('a').attr('href'); | 80 | location.href = $(gotoConsultEle).find('a').attr('href'); |
79 | }); | 81 | }); |
80 | -} | ||
82 | +} | ||
83 | + | ||
84 | +function fixConsultBar() { | ||
85 | + if ($(window).scrollTop() > $('#yoho-header').outerHeight()) { | ||
86 | + $gotoConsult.css('position', 'fixed'); | ||
87 | + $gotoConsult.css('top', '0'); | ||
88 | + } else { | ||
89 | + $gotoConsult.css('position', 'static'); | ||
90 | + } | ||
91 | +} | ||
92 | + | ||
93 | +//滚动时顶部固定 我要咨询 | ||
94 | +function scrollHandler() { | ||
95 | + fixConsultBar(); | ||
96 | +} | ||
97 | + | ||
98 | +$(window).scroll(function() { | ||
99 | + window.requestAnimationFrame(scrollHandler); | ||
100 | +}); |
@@ -15,7 +15,10 @@ var goodsSwiper, | @@ -15,7 +15,10 @@ var goodsSwiper, | ||
15 | var goodsDiscountEl = document.getElementById('goodsDiscount'), | 15 | var goodsDiscountEl = document.getElementById('goodsDiscount'), |
16 | goodsDiscountHammer = goodsDiscountEl && new Hammer(goodsDiscountEl); | 16 | goodsDiscountHammer = goodsDiscountEl && new Hammer(goodsDiscountEl); |
17 | 17 | ||
18 | -var $cart = $('.cart-bar'); | 18 | +var $cart = $('.cart-bar'), |
19 | + $goodsSubtitle = $('.goodsSubtitle'), | ||
20 | + divH, | ||
21 | + $goodsSubtitleSpan; | ||
19 | 22 | ||
20 | require('./desc'); | 23 | require('./desc'); |
21 | require('./comments-consults'); | 24 | require('./comments-consults'); |
@@ -82,4 +85,12 @@ $.ajax({ | @@ -82,4 +85,12 @@ $.ajax({ | ||
82 | } | 85 | } |
83 | }); | 86 | }); |
84 | 87 | ||
88 | +//限制goodsSubtitle为两行 | ||
89 | +if ($goodsSubtitle[0]) { | ||
90 | + divH = $goodsSubtitle.height(); | ||
91 | + $goodsSubtitleSpan = $goodsSubtitle.find('span'); | ||
92 | + while ($goodsSubtitleSpan.outerHeight() > divH) { | ||
93 | + $goodsSubtitleSpan.text($goodsSubtitleSpan.text().replace(/(\s)*([a-zA-Z0-9]+|\W)(\.\.\.)?$/, '...')); | ||
94 | + } | ||
95 | +} | ||
85 | require('./like'); | 96 | require('./like'); |
@@ -41,6 +41,8 @@ | @@ -41,6 +41,8 @@ | ||
41 | .goods-consults-page { | 41 | .goods-consults-page { |
42 | background-color: #f0f0f0; | 42 | background-color: #f0f0f0; |
43 | .goto-consult { | 43 | .goto-consult { |
44 | + width: 100%; | ||
45 | + box-sizing:border-box; | ||
44 | padding: 0 pxToRem(28px); | 46 | padding: 0 pxToRem(28px); |
45 | height: pxToRem(120px); | 47 | height: pxToRem(120px); |
46 | background-color: #ffffff; | 48 | background-color: #ffffff; |
@@ -211,14 +211,19 @@ $basicBtnC:#eb0313; | @@ -211,14 +211,19 @@ $basicBtnC:#eb0313; | ||
211 | background-color: #515150; | 211 | background-color: #515150; |
212 | } | 212 | } |
213 | .goodsSubtitle { | 213 | .goodsSubtitle { |
214 | - min-height: pxToRem(87px); | 214 | + height: pxToRem(88px); |
215 | font-size: pxToRem(24px); | 215 | font-size: pxToRem(24px); |
216 | - line-height: pxToRem(36px); | ||
217 | color: $subFontC; | 216 | color: $subFontC; |
218 | padding-left: pxToRem(28px); | 217 | padding-left: pxToRem(28px); |
219 | padding-right: pxToRem(28px); | 218 | padding-right: pxToRem(28px); |
219 | + padding-top: pxToRem(14px); | ||
220 | border-bottom: 1px solid $borderC; | 220 | border-bottom: 1px solid $borderC; |
221 | background-color: #f4f4f4; | 221 | background-color: #f4f4f4; |
222 | + span{ | ||
223 | + display: block; | ||
224 | + line-height: pxToRem(36px); | ||
225 | + margin: 0; | ||
226 | + } | ||
222 | } | 227 | } |
223 | .price-date { | 228 | .price-date { |
224 | // width: 100%; | 229 | // width: 100%; |
@@ -253,8 +258,7 @@ $basicBtnC:#eb0313; | @@ -253,8 +258,7 @@ $basicBtnC:#eb0313; | ||
253 | line-height: pxToRem(88px); | 258 | line-height: pxToRem(88px); |
254 | } | 259 | } |
255 | } | 260 | } |
256 | - .goodsName, | ||
257 | - .goodsSubtitle { | 261 | + .goodsName { |
258 | // width: 100%; | 262 | // width: 100%; |
259 | display: table; | 263 | display: table; |
260 | span { | 264 | span { |
-
Please register or login to post a comment