Authored by ccbikai

在线客服 点击高亮

@@ -18,3 +18,10 @@ $questionTab.on('touchend', function() { @@ -18,3 +18,10 @@ $questionTab.on('touchend', function() {
18 $('.question-list').removeClass('current'); 18 $('.question-list').removeClass('current');
19 $(clickTab).addClass('current'); 19 $(clickTab).addClass('current');
20 }); 20 });
  21 +
  22 +$('.yoho-page').on('touchstart', '.connect-item, .question-item', function() {
  23 + $(this).siblings().removeClass('highlight');
  24 + $(this).addClass('highlight');
  25 +}).on('touchend touchcancel', '.connect-item, .question-item', function() {
  26 + $(this).removeClass('highlight');
  27 +});
@@ -31,6 +31,7 @@ @@ -31,6 +31,7 @@
31 margin: 0 rem(32); 31 margin: 0 rem(32);
32 border-left: 1px solid #b0b0b0; 32 border-left: 1px solid #b0b0b0;
33 } 33 }
  34 +
34 } 35 }
35 36
36 .question-list { 37 .question-list {
@@ -43,15 +44,15 @@ @@ -43,15 +44,15 @@
43 } 44 }
44 45
45 li { 46 li {
46 - margin-left: rem(30);  
47 - width: rem(610);  
48 font-size: rem(28); 47 font-size: rem(28);
49 line-height: rem(90); 48 line-height: rem(90);
50 - border-bottom: 1px solid #ccc;  
51 49
52 a { 50 a {
53 display: block; 51 display: block;
54 color: #444; 52 color: #444;
  53 + width: rem(610);
  54 + margin-left: rem(30);
  55 + border-bottom: 1px solid #ccc;
55 } 56 }
56 57
57 .iconfont { 58 .iconfont {
@@ -64,6 +65,10 @@ @@ -64,6 +65,10 @@
64 &:last-child { 65 &:last-child {
65 border-bottom: none; 66 border-bottom: none;
66 } 67 }
  68 +
  69 + &.highlight {
  70 + background: #eee;
  71 + }
67 } 72 }
68 } 73 }
69 74
@@ -112,6 +117,9 @@ @@ -112,6 +117,9 @@
112 content: none; 117 content: none;
113 } 118 }
114 } 119 }
  120 + &.highlight {
  121 + background: #eee;
  122 + }
115 } 123 }
116 .icon { 124 .icon {
117 display: inline-block; 125 display: inline-block;
@@ -132,6 +140,7 @@ @@ -132,6 +140,7 @@
132 border-bottom: 1px solid #c8c7cc; 140 border-bottom: 1px solid #c8c7cc;
133 color: #444; 141 color: #444;
134 background: #fff; 142 background: #fff;
  143 +
135 &:last-child { 144 &:last-child {
136 margin-bottom: 0; 145 margin-bottom: 0;
137 } 146 }
@@ -146,6 +155,7 @@ @@ -146,6 +155,7 @@
146 .question { 155 .question {
147 @extend %qa; 156 @extend %qa;
148 position: relative; 157 position: relative;
  158 + color: #000;
149 &:after { 159 &:after {
150 content: ''; 160 content: '';
151 position: absolute; 161 position: absolute;