Authored by 毕凯

个人中心点击增加背景色

@@ -6,6 +6,7 @@ @@ -6,6 +6,7 @@
6 var $ = require('jquery'); 6 var $ = require('jquery');
7 7
8 var $footer = $('#yoho-footer'), 8 var $footer = $('#yoho-footer'),
  9 + $yohoPage = $('.yoho-page'),
9 $header = $('.yoho-header'); 10 $header = $('.yoho-header');
10 11
11 function cookie(name) { 12 function cookie(name) {
@@ -176,6 +177,13 @@ $header.on('touchstart', 'a', function() { @@ -176,6 +177,13 @@ $header.on('touchstart', 'a', function() {
176 $(this).removeClass('highlight'); 177 $(this).removeClass('highlight');
177 }); 178 });
178 179
  180 +$yohoPage.on('touchstart', '.tap-hightlight', function() {
  181 + $(this).siblings('.tap-hightlight').removeClass('highlight');
  182 + $(this).addClass('highlight');
  183 +}).on('touchend touchcancel', '.tap-hightlight', function() {
  184 + $(this).removeClass('highlight');
  185 +});
  186 +
179 (function() { 187 (function() {
180 var lastTime = 0, 188 var lastTime = 0,
181 prefixes = 'webkit moz ms o'.split(' '), 189 prefixes = 'webkit moz ms o'.split(' '),
@@ -105,6 +105,12 @@ a { @@ -105,6 +105,12 @@ a {
105 @include border-radius(10px); 105 @include border-radius(10px);
106 } 106 }
107 107
  108 +.tap-hightlight {
  109 + &.highlight {
  110 + background: #eee!important;
  111 + }
  112 +}
  113 +
108 .load-more-info { 114 .load-more-info {
109 width: 100%; 115 width: 100%;
110 height: 70rem / $pxConvertRem; 116 height: 70rem / $pxConvertRem;
@@ -59,8 +59,16 @@ @@ -59,8 +59,16 @@
59 59
60 .more-icon { 60 .more-icon {
61 position: absolute; 61 position: absolute;
62 - top: 0;  
63 - right: 30rem / $pxConvertRem; 62 + top: pxToRem(40px);
  63 + right: pxToRem(30px);
  64 + width: pxToRem(88px);
  65 + height: pxToRem(88px);
  66 + line-height: pxToRem(88px);
  67 + text-align: center;
  68 +
  69 + &.highlight {
  70 + background: rgba(200,200,200,.1)!important;
  71 + }
64 } 72 }
65 } 73 }
66 74
@@ -92,6 +100,10 @@ @@ -92,6 +100,10 @@
92 width: pxToRem(320px); 100 width: pxToRem(320px);
93 // width: pxToRem(213px); 三栏宽度 101 // width: pxToRem(213px); 三栏宽度
94 102
  103 + &.highlight {
  104 + background: rgba(200,200,200,.1) !important;
  105 + }
  106 +
95 p { 107 p {
96 font-size: pxToRem(24px); 108 font-size: pxToRem(24px);
97 } 109 }
@@ -8,7 +8,7 @@ @@ -8,7 +8,7 @@
8 {{#vip_info}} 8 {{#vip_info}}
9 <span class="vip-icon vip-{{cur_level}}"></span> 9 <span class="vip-icon vip-{{cur_level}}"></span>
10 {{/vip_info}} 10 {{/vip_info}}
11 - <div class="iconfont more-icon">&#xe604;</div> 11 + <div class="iconfont more-icon tap-hightlight">&#xe604;</div>
12 </a> 12 </a>
13 {{/isLogin}} 13 {{/isLogin}}
14 {{^isLogin}} 14 {{^isLogin}}
@@ -20,16 +20,16 @@ @@ -20,16 +20,16 @@
20 {{/isLogin}} 20 {{/isLogin}}
21 </div> 21 </div>
22 <div class="my-link clearfix {{^isLogin}}no-login{{/isLogin}}"> 22 <div class="my-link clearfix {{^isLogin}}no-login{{/isLogin}}">
23 - <a class="link-item" href="/home/favorite"> 23 + <a class="link-item tap-hightlight" href="/home/favorite">
24 {{#isLogin}}{{product_favorite_total}}{{/isLogin}} 24 {{#isLogin}}{{product_favorite_total}}{{/isLogin}}
25 <p>收藏的商品</p> 25 <p>收藏的商品</p>
26 </a> 26 </a>
27 - <a class="link-item" href="/home/favorite?tab=brand"> 27 + <a class="link-item tap-hightlight" href="/home/favorite?tab=brand">
28 {{#isLogin}}{{brand_favorite_total}}{{/isLogin}} 28 {{#isLogin}}{{brand_favorite_total}}{{/isLogin}}
29 <p>收藏的品牌</p> 29 <p>收藏的品牌</p>
30 </a> 30 </a>
31 {{! 31 {{!
32 - <a class="link-item" href="/home/record"> 32 + <a class="link-item tap-hightlight" href="/home/record">
33 <!-- product_browse --> 33 <!-- product_browse -->
34 34
35 <p>浏览记录</p> 35 <p>浏览记录</p>
@@ -3,7 +3,7 @@ @@ -3,7 +3,7 @@
3 {{# order}} 3 {{# order}}
4 <ul id="order-nav" class="order-nav clearfix"> 4 <ul id="order-nav" class="order-nav clearfix">
5 {{#each navs}} 5 {{#each navs}}
6 - <li {{#if active}}class="active"{{/if}} data-type="{{typeId}}"> 6 + <li class="tap-hightlight {{#if active}}active{{/if}}" data-type="{{typeId}}">
7 <a href="{{url}}">{{name}}</a> 7 <a href="{{url}}">{{name}}</a>
8 </li> 8 </li>
9 {{/each}} 9 {{/each}}
1 {{> layout/header}} 1 {{> layout/header}}
2 - <div class="personal-details"> 2 + <div class="personal-details yoho-page">
3 <ul> 3 <ul>
4 <li><span>头像</span><span><i class="head-portrait user-avatar" data-avatar="{{head_ico}}"></i></span></li> 4 <li><span>头像</span><span><i class="head-portrait user-avatar" data-avatar="{{head_ico}}"></i></span></li>
5 <li><span>昵称</span><span>{{ nickname }}</span></li> 5 <li><span>昵称</span><span>{{ nickname }}</span></li>
6 <li><span>性别</span><span>{{ gender }}</span></li> 6 <li><span>性别</span><span>{{ gender }}</span></li>
7 <li><span>生日</span><span>{{ birthday }}</span></li> 7 <li><span>生日</span><span>{{ birthday }}</span></li>
8 - <li><span>会员等级</span> 8 + <li class="tap-hightlight"><span>会员等级</span>
9 <span> 9 <span>
10 <a href="grade" class="grade"> 10 <a href="grade" class="grade">
11 {{# vip_info}} 11 {{# vip_info}}
@@ -23,7 +23,7 @@ @@ -23,7 +23,7 @@
23 </div> 23 </div>
24 {{/unless}} 24 {{/unless}}
25 25
26 - <a class="all-privilege block" href="{{allUrl}}"> 26 + <a class="all-privilege block tap-hightlight" href="{{allUrl}}">
27 查看全部VIP特权 27 查看全部VIP特权
28 <span class="iconfont">&#xe604;</span> 28 <span class="iconfont">&#xe604;</span>
29 </a> 29 </a>