Authored by yyq

图片缩略图操作

@@ -95,11 +95,11 @@ const setBrandBanner = brand => { @@ -95,11 +95,11 @@ const setBrandBanner = brand => {
95 let data = { 95 let data = {
96 bgColor: '#000', 96 bgColor: '#000',
97 brandLogo: { 97 brandLogo: {
98 - link: `#${brand.brandDomain}`, // 品牌跳转链接 -- 待处理 98 + link: `/product/shop/${brand.brandDomain}`, // 品牌跳转链接 -- 待处理
99 img: brand.brandIco 99 img: brand.brandIco
100 }, 100 },
101 brandHome: { 101 brandHome: {
102 - link: `#${brand.brandDomain}` // 品牌跳转链接 -- 待处理 102 + link: `/product/shop/${brand.brandDomain}` // 品牌跳转链接 -- 待处理
103 } 103 }
104 }; 104 };
105 105
@@ -8,12 +8,12 @@ @@ -8,12 +8,12 @@
8 {{# goodInfo}} 8 {{# goodInfo}}
9 <div class="product-main clearfix"> 9 <div class="product-main clearfix">
10 <div class="thumbs left clearfix"> 10 <div class="thumbs left clearfix">
11 - <div class="thumb-list"> 11 + <div class="thumb-list hide">
12 {{# colors}} 12 {{# colors}}
13 <div class="thumb-wrap{{#unless cur}} hide{{/unless}}"> 13 <div class="thumb-wrap{{#unless cur}} hide{{/unless}}">
14 {{#if cur}} 14 {{#if cur}}
15 {{# thumbs}} 15 {{# thumbs}}
16 - <img class="thumb" src="{{image . 75 100}}" data-shower="{{image . 482 643}}"> 16 + <img class="thumb{{#if @first}} cur{{/if}}" src="{{image . 75 100}}" data-shower="{{image . 482 643}}">
17 {{/ thumbs}} 17 {{/ thumbs}}
18 {{^}} 18 {{^}}
19 {{# thumbs}} 19 {{# thumbs}}
@@ -77,10 +77,22 @@ @@ -77,10 +77,22 @@
77 <span class="btn">即将开售</span> 77 <span class="btn">即将开售</span>
78 {{/if}} 78 {{/if}}
79 {{^}} 79 {{^}}
80 - <span id="add-to-bag" class="btn">加入购物袋</span> 80 + <span id="add-to-bag" class="btn">
  81 + <i class="iconfont">&#xe632;</i>
  82 + 加入购物袋
  83 + </span>
81 {{/ fashionTopGoods}} 84 {{/ fashionTopGoods}}
82 <span id="sold-out" class="btn disable hide">已售罄</span> 85 <span id="sold-out" class="btn disable hide">已售罄</span>
83 - <span id="collect-product" class="btn white">收藏商品</span> 86 + <span id="collect-product" class="btn white">
  87 + <span class="collecting">
  88 + <i class="iconfont">&#xe644;</i>
  89 + 收藏商品
  90 + </span>
  91 + <span class="collected">
  92 + <i class="iconfont">&#xe627;</i>
  93 + 已收藏
  94 + </span>
  95 + </span>
84 </p> 96 </p>
85 {{> share}} 97 {{> share}}
86 </div> 98 </div>
No preview for this file type
@@ -2,7 +2,7 @@ @@ -2,7 +2,7 @@
2 <!DOCTYPE svg PUBLIC "-//W3C//DTD SVG 1.1//EN" "http://www.w3.org/Graphics/SVG/1.1/DTD/svg11.dtd" > 2 <!DOCTYPE svg PUBLIC "-//W3C//DTD SVG 1.1//EN" "http://www.w3.org/Graphics/SVG/1.1/DTD/svg11.dtd" >
3 <svg xmlns="http://www.w3.org/2000/svg"> 3 <svg xmlns="http://www.w3.org/2000/svg">
4 <metadata> 4 <metadata>
5 -Created by FontForge 20120731 at Thu Jul 14 10:06:11 2016 5 +Created by FontForge 20120731 at Sat Jul 16 14:46:14 2016
6 By admin 6 By admin
7 </metadata> 7 </metadata>
8 <defs> 8 <defs>
@@ -19,7 +19,7 @@ Created by FontForge 20120731 at Thu Jul 14 10:06:11 2016 @@ -19,7 +19,7 @@ Created by FontForge 20120731 at Thu Jul 14 10:06:11 2016
19 bbox="0 -224 1303 896.303" 19 bbox="0 -224 1303 896.303"
20 underline-thickness="50" 20 underline-thickness="50"
21 underline-position="-100" 21 underline-position="-100"
22 - unicode-range="U+0078-E643" 22 + unicode-range="U+0078-E644"
23 /> 23 />
24 <missing-glyph horiz-adv-x="374" 24 <missing-glyph horiz-adv-x="374"
25 d="M34 0v682h272v-682h-272zM68 34h204v614h-204v-614z" /> 25 d="M34 0v682h272v-682h-272zM68 34h204v614h-204v-614z" />
@@ -233,5 +233,9 @@ t-14.5 40.5t-39.5 15.5z" /> @@ -233,5 +233,9 @@ t-14.5 40.5t-39.5 15.5z" />
233 <glyph glyph-name="uniE643" unicode="&#xe643;" 233 <glyph glyph-name="uniE643" unicode="&#xe643;"
234 d="M512 896q-139 0 -257 -68.5t-186.5 -186.5t-68.5 -257t68.5 -257t186.5 -186.5t257 -68.5t257 68.5t186.5 186.5t68.5 257t-68.5 257t-186.5 186.5t-257 68.5zM563 26h-102v102h102v-102zM669 422l-46 -47q-32 -32 -46 -62t-14 -83h-102v26q0 84 60 145l63 64 234 d="M512 896q-139 0 -257 -68.5t-186.5 -186.5t-68.5 -257t68.5 -257t186.5 -186.5t257 -68.5t257 68.5t186.5 186.5t68.5 257t-68.5 257t-186.5 186.5t-257 68.5zM563 26h-102v102h102v-102zM669 422l-46 -47q-32 -32 -46 -62t-14 -83h-102v26q0 84 60 145l63 64
235 q30 30 30 73q0 42 -30 72t-72 30t-72 -30t-30 -72h-103q0 84 60 144t145 60t145 -60t60 -144q0 -68 -48 -116z" /> 235 q30 30 30 73q0 42 -30 72t-72 30t-72 -30t-30 -72h-103q0 84 60 144t145 60t145 -60t60 -144q0 -68 -48 -116z" />
  236 + <glyph glyph-name="uniE644" unicode="&#xe644;"
  237 +d="M707 803q-57 0 -108.5 -27.5t-87.5 -75.5q-36 48 -87.5 75.5t-108.5 27.5q-105 0 -179 -81t-74 -196q0 -42 13 -84t25.5 -64t34.5 -57q27 -42 72 -92.5t86 -89.5t88 -79.5t66 -55.5t32 -25q14 -11 32 -11t32 11q13 9 32 24.5t66 56t88 79.5t86 89.5t72 92.5
  238 +q22 35 34.5 57t25.5 64t13 84q0 115 -74 196t-179 81zM841 356q-26 -40 -70 -89t-84.5 -87t-86.5 -77t-62.5 -52.5t-26.5 -21.5q-10 8 -26.5 21t-62.5 52.5t-86 77.5t-84.5 87t-70.5 89q-20 32 -31.5 53t-21.5 53t-10 64q0 89 57.5 152t139.5 63q59 0 107.5 -35t71.5 -93v1
  239 +q4 -14 17 -14t17 14q23 57 71.5 92t107.5 35q82 0 139.5 -63t57.5 -152q0 -46 -16 -83.5t-47 -86.5z" />
236 </font> 240 </font>
237 </defs></svg> 241 </defs></svg>
No preview for this file type
No preview for this file type
@@ -90,6 +90,20 @@ function chooseColor(index) { @@ -90,6 +90,20 @@ function chooseColor(index) {
90 $sizeList.eq(index).removeClass('hide'); 90 $sizeList.eq(index).removeClass('hide');
91 } 91 }
92 92
  93 +// 缩略图垂直居中
  94 +$thumbWrap.each(function() {
  95 + var $this = $(this),
  96 + $child = $this.children();
  97 +
  98 + if ($child.length) {
  99 + $this.css('padding-top', (642 - 105 * $child.length) / 2);
  100 + }
  101 +
  102 +});
  103 +
  104 +// $thumbWrap.parent().animate({visibility: 'visible'});
  105 +$thumbWrap.parent().removeClass('hide');
  106 +
93 // 展示图 107 // 展示图
94 $thumbWrap.on('mouseenter', '.thumb', function() { 108 $thumbWrap.on('mouseenter', '.thumb', function() {
95 changeThumb($(this)); 109 changeThumb($(this));
@@ -6,7 +6,6 @@ @@ -6,7 +6,6 @@
6 .thumb-list { 6 .thumb-list {
7 width: 75px; 7 width: 75px;
8 display: inline-block; 8 display: inline-block;
9 - vertical-align: middle;  
10 } 9 }
11 10
12 .thumb { 11 .thumb {
@@ -140,6 +139,28 @@ @@ -140,6 +139,28 @@
140 line-height: 46px; 139 line-height: 46px;
141 margin: 0 auto 20px; 140 margin: 0 auto 20px;
142 cursor: pointer; 141 cursor: pointer;
  142 +
  143 + &.white {
  144 + color: #1d1d1d;
  145 + }
  146 +
  147 + .iconfont {
  148 + font-size: 14px;
  149 + }
  150 +
  151 + .collected {
  152 + display: none;
  153 + }
  154 + }
  155 +
  156 + .coll {
  157 + .collecting {
  158 + display: none;
  159 + }
  160 +
  161 + .collected {
  162 + display: block;
  163 + }
143 } 164 }
144 165
145 .share { 166 .share {