个人中心点击增加背景色

@@ -6,6 +6,7 @@
 var $ = require('jquery');
 
 var $footer = $('#yoho-footer'),
+    $yohoPage = $('.yoho-page'),
     $header = $('.yoho-header');
 
 function cookie(name) {
@@ -176,6 +177,13 @@ $header.on('touchstart', 'a', function() {
     $(this).removeClass('highlight');
 });
 
+$yohoPage.on('touchstart', '.tap-hightlight', function() {
+    $(this).siblings('.tap-hightlight').removeClass('highlight');
+    $(this).addClass('highlight');
+}).on('touchend touchcancel', '.tap-hightlight', function() {
+    $(this).removeClass('highlight');
+});
+
 (function() {
     var lastTime = 0,
         prefixes = 'webkit moz ms o'.split(' '),

@@ -23,10 +23,10 @@ html, body {
 }
 
 .clearfix:after {
-    clear: both; 
+    clear: both;
 }
 
-.clearfix { 
+.clearfix {
     *zoom: 1;
 }
 
@@ -105,6 +105,12 @@ a {
     @include border-radius(10px);
 }
 
+.tap-hightlight {
+    &.highlight {
+        background: #eee!important;
+    }
+}
+
 .load-more-info {
     width: 100%;
     height: 70rem / $pxConvertRem;

@@ -59,8 +59,16 @@
 
         .more-icon {
             position: absolute;
-            top: 0;
-            right: 30rem / $pxConvertRem;
+            top: pxToRem(40px);
+            right: pxToRem(30px);
+            width: pxToRem(88px);
+            height: pxToRem(88px);
+            line-height: pxToRem(88px);
+            text-align: center;
+
+            &.highlight {
+                background: rgba(200,200,200,.1)!important;
+            }
         }
     }
 
@@ -92,6 +100,10 @@
             width: pxToRem(320px);
             // width: pxToRem(213px); 三栏宽度
 
+            &.highlight {
+                background: rgba(200,200,200,.1) !important;
+            }
+
             p {
                 font-size: pxToRem(24px);
             }

@@ -8,7 +8,7 @@
                 {{#vip_info}}
                 <span class="vip-icon vip-{{cur_level}}"></span>
                 {{/vip_info}}
-                <div class="iconfont more-icon">&#xe604;</div>
+                <div class="iconfont more-icon tap-hightlight">&#xe604;</div>
             </a>
             {{/isLogin}}
             {{^isLogin}}
@@ -20,16 +20,16 @@
             {{/isLogin}}
         </div>
         <div class="my-link clearfix {{^isLogin}}no-login{{/isLogin}}">
-            <a class="link-item" href="/home/favorite">
+            <a class="link-item tap-hightlight" href="/home/favorite">
                 {{#isLogin}}{{product_favorite_total}}{{/isLogin}}
                 <p>收藏的商品</p>
             </a>
-            <a class="link-item" href="/home/favorite?tab=brand">
+            <a class="link-item tap-hightlight" href="/home/favorite?tab=brand">
                 {{#isLogin}}{{brand_favorite_total}}{{/isLogin}}
                 <p>收藏的品牌</p>
             </a>
             {{!
-            <a class="link-item" href="/home/record">
+            <a class="link-item tap-hightlight" href="/home/record">
                 <!-- product_browse -->
 
                 <p>浏览记录</p>

@@ -3,7 +3,7 @@
     {{# order}}
         <ul id="order-nav" class="order-nav clearfix">
             {{#each navs}}
-                <li {{#if active}}class="active"{{/if}} data-type="{{typeId}}">
+                <li class="tap-hightlight {{#if active}}active{{/if}}" data-type="{{typeId}}">
                     <a href="{{url}}">{{name}}</a>
                 </li>
             {{/each}}
@@ -16,4 +16,4 @@
         </div>
     {{/ order}}
 </div>
-{{> layout/footer}}
\ No newline at end of file
+{{> layout/footer}}

 {{> layout/header}}
-    <div class="personal-details">
+    <div class="personal-details yoho-page">
         <ul>
             <li><span>头像</span><span><i class="head-portrait user-avatar" data-avatar="{{head_ico}}"></i></span></li>
             <li><span>昵称</span><span>{{ nickname }}</span></li>
             <li><span>性别</span><span>{{ gender }}</span></li>
             <li><span>生日</span><span>{{ birthday }}</span></li>
-            <li><span>会员等级</span>
+            <li class="tap-hightlight"><span>会员等级</span>
                 <span>
                     <a href="grade" class="grade">
-                        {{# vip_info}}  
+                        {{# vip_info}}
                         <i class="vip-icon vip-{{ cur_level}}"></i>
                         {{/ vip_info}}
                         <span class="iconfont">&#xe604;</span>
-                    </a>  
+                    </a>
                 </span>
             </li>
         </ul>
     </div>
-{{> layout/footer}}
\ No newline at end of file
+{{> layout/footer}}

@@ -23,10 +23,10 @@
             </div>
         {{/unless}}
 
-        <a class="all-privilege block" href="{{allUrl}}">
+        <a class="all-privilege block tap-hightlight" href="{{allUrl}}">
             查看全部VIP特权
             <span class="iconfont">&#xe604;</span>
         </a>
     {{/ vipGrade}}
 </div>
-{{> layout/footer}}
\ No newline at end of file
+{{> layout/footer}}