Showing
9 changed files
with
93 additions
and
4 deletions
static/img/me/index-s6ecbff762a.png
0 → 100644
4.12 KB
static/img/me/index/talk.png
0 → 100644
2.07 KB
static/img/me/index/volume.png
0 → 100644
612 Bytes
@@ -3,7 +3,8 @@ | @@ -3,7 +3,8 @@ | ||
3 | * @author: bikai<kai.bi@yoho.cn> | 3 | * @author: bikai<kai.bi@yoho.cn> |
4 | * @date: 2015/11/12 | 4 | * @date: 2015/11/12 |
5 | */ | 5 | */ |
6 | -var $ = require('jquery'); | 6 | +var $ = require('jquery'), |
7 | + noticeScroll = require('../plugin/notice-scroll'); | ||
7 | var $userAvatar = $('.user-avatar'), | 8 | var $userAvatar = $('.user-avatar'), |
8 | $listItem = $('.list-item'); | 9 | $listItem = $('.list-item'); |
9 | var myImage = new Image(), | 10 | var myImage = new Image(), |
@@ -19,6 +20,8 @@ myImage.onload = function() { | @@ -19,6 +20,8 @@ myImage.onload = function() { | ||
19 | $userAvatar.css('background-image', 'url(' + avatar + ')'); | 20 | $userAvatar.css('background-image', 'url(' + avatar + ')'); |
20 | }; | 21 | }; |
21 | 22 | ||
23 | +noticeScroll('.notice'); | ||
24 | + | ||
22 | $('.yoho-page').on('touchstart', '.list-item, .type-item, .order-title', function() { | 25 | $('.yoho-page').on('touchstart', '.list-item, .type-item, .order-title', function() { |
23 | $listItem.removeClass('highlight'); | 26 | $listItem.removeClass('highlight'); |
24 | $(this).addClass('highlight'); | 27 | $(this).addClass('highlight'); |
static/js/plugin/notice-scroll.js
0 → 100644
1 | +/** | ||
2 | + * 公告栏目滚动 | ||
3 | + * bikai kai.bi@yoho.cn | ||
4 | + */ | ||
5 | + | ||
6 | +var $ = require('jquery'); | ||
7 | + | ||
8 | +function noticeScroll(selecter, time) { | ||
9 | + var $notice = $(selecter), | ||
10 | + $noticeItem = $notice.find('.notice-item'), | ||
11 | + count = $noticeItem.length, | ||
12 | + i = 1; | ||
13 | + | ||
14 | + selecter = selecter || '.notice'; | ||
15 | + time = time || 3000; | ||
16 | + | ||
17 | + if (count > 1) { | ||
18 | + setInterval(function() { | ||
19 | + if (i >= count) { | ||
20 | + i = 0; | ||
21 | + } | ||
22 | + $noticeItem.fadeOut(); | ||
23 | + $notice.find('.item-' + i).fadeIn(); | ||
24 | + i++; | ||
25 | + }, time); | ||
26 | + } | ||
27 | +} | ||
28 | + | ||
29 | +module.exports = noticeScroll; |
@@ -86,7 +86,6 @@ | @@ -86,7 +86,6 @@ | ||
86 | } | 86 | } |
87 | 87 | ||
88 | .my-link { | 88 | .my-link { |
89 | - margin-bottom: pxToRem(30px); | ||
90 | padding: pxToRem(6px) 0; | 89 | padding: pxToRem(6px) 0; |
91 | text-align: center; | 90 | text-align: center; |
92 | background: rgba(0,0,0,0.8); | 91 | background: rgba(0,0,0,0.8); |
@@ -133,6 +132,34 @@ | @@ -133,6 +132,34 @@ | ||
133 | } | 132 | } |
134 | } | 133 | } |
135 | 134 | ||
135 | + .notice { | ||
136 | + margin-bottom: pxToRem(30px); | ||
137 | + padding: 0 pxToRem(30px); | ||
138 | + background: #fff; | ||
139 | + height: pxToRem(72px); | ||
140 | + overflow: hidden; | ||
141 | + | ||
142 | + .notice-item { | ||
143 | + display: block; | ||
144 | + width: 100%; | ||
145 | + font-size: pxToRem(24px); | ||
146 | + line-height: pxToRem(72px); | ||
147 | + color: #444; | ||
148 | + white-space: nowrap; | ||
149 | + overflow: hidden; | ||
150 | + text-overflow: ellipsis; | ||
151 | + } | ||
152 | + | ||
153 | + .notice-icon { | ||
154 | + display: inline-block; | ||
155 | + margin-right: pxToRem(10px); | ||
156 | + width: pxToRem(28px); | ||
157 | + height: pxToRem(28px); | ||
158 | + @include rem-sprite($index, volume); | ||
159 | + vertical-align: middle; | ||
160 | + } | ||
161 | + } | ||
162 | + | ||
136 | .my-order { | 163 | .my-order { |
137 | margin-bottom: pxToRem(30px); | 164 | margin-bottom: pxToRem(30px); |
138 | border-top: 1px solid #e0e0e0; | 165 | border-top: 1px solid #e0e0e0; |
@@ -206,17 +233,18 @@ | @@ -206,17 +233,18 @@ | ||
206 | padding: 0 pxToRem(30px); | 233 | padding: 0 pxToRem(30px); |
207 | font-size: 16px; | 234 | font-size: 16px; |
208 | line-height: pxToRem(88px); | 235 | line-height: pxToRem(88px); |
236 | + | ||
209 | .opinion{ | 237 | .opinion{ |
210 | width: 1.3rem; | 238 | width: 1.3rem; |
211 | height: 1.3rem; | 239 | height: 1.3rem; |
212 | overflow: hidden; | 240 | overflow: hidden; |
213 | display: inline-block; | 241 | display: inline-block; |
214 | - background-image:url("data:image/png;base64,iVBORw0KGgoAAAANSUhEUgAAADIAAAAyCAYAAAAeP4ixAAAAGXRFWHRTb2Z0d2FyZQBBZG9iZSBJbWFnZVJlYWR5ccllPAAAAyhpVFh0WE1MOmNvbS5hZG9iZS54bXAAAAAAADw/eHBhY2tldCBiZWdpbj0i77u/IiBpZD0iVzVNME1wQ2VoaUh6cmVTek5UY3prYzlkIj8+IDx4OnhtcG1ldGEgeG1sbnM6eD0iYWRvYmU6bnM6bWV0YS8iIHg6eG1wdGs9IkFkb2JlIFhNUCBDb3JlIDUuNi1jMDY3IDc5LjE1Nzc0NywgMjAxNS8wMy8zMC0yMzo0MDo0MiAgICAgICAgIj4gPHJkZjpSREYgeG1sbnM6cmRmPSJodHRwOi8vd3d3LnczLm9yZy8xOTk5LzAyLzIyLXJkZi1zeW50YXgtbnMjIj4gPHJkZjpEZXNjcmlwdGlvbiByZGY6YWJvdXQ9IiIgeG1sbnM6eG1wTU09Imh0dHA6Ly9ucy5hZG9iZS5jb20veGFwLzEuMC9tbS8iIHhtbG5zOnN0UmVmPSJodHRwOi8vbnMuYWRvYmUuY29tL3hhcC8xLjAvc1R5cGUvUmVzb3VyY2VSZWYjIiB4bWxuczp4bXA9Imh0dHA6Ly9ucy5hZG9iZS5jb20veGFwLzEuMC8iIHhtcE1NOkRvY3VtZW50SUQ9InhtcC5kaWQ6NTkyQTQ3NkNCOEQ4MTFFNUIzNTY5MTI2NjU5ODYzQkQiIHhtcE1NOkluc3RhbmNlSUQ9InhtcC5paWQ6NTkyQTQ3NkJCOEQ4MTFFNUIzNTY5MTI2NjU5ODYzQkQiIHhtcDpDcmVhdG9yVG9vbD0iQWRvYmUgUGhvdG9zaG9wIENDIDIwMTUgKE1hY2ludG9zaCkiPiA8eG1wTU06RGVyaXZlZEZyb20gc3RSZWY6aW5zdGFuY2VJRD0ieG1wLmlpZDpDMkMzNzRFRkFFMEYxMUU1OEM0Q0U0Q0M3NkZCNzIyMCIgc3RSZWY6ZG9jdW1lbnRJRD0ieG1wLmRpZDpDMkMzNzRGMEFFMEYxMUU1OEM0Q0U0Q0M3NkZCNzIyMCIvPiA8L3JkZjpEZXNjcmlwdGlvbj4gPC9yZGY6UkRGPiA8L3g6eG1wbWV0YT4gPD94cGFja2V0IGVuZD0iciI/PhkYSdAAAAS0SURBVHja7FpZSFRhFL6TrUZJC0K2WFlmL0Y7thcjkWZlQfVQ0QJWD+09tEMb9BAkPlVQCYVESJtlhhbRJkVqiCHtqylRD5Ut0GLfyTPxe/zvvePM3JlJPPD537n33HPOd8+//7rq6uqM5iCtjGYizYZIa/rjcrn8MuJ2u/ugGAuMBgYD/YBoIEpR+wi8A54DlcAd4FZRUdErf3x7moaLLnwhguBjUSwGZgOJfsRSDpwGskHqZdCIgMBwFDuA6QGumr+BC8AuECpxjAgI9EaRyRlwWihDa0HodUCJgEQGiv1AJwu1x8B1oISvqe5/Ar4D7YHOALWlgQBldQJfm8lnYCPIHPabCAhEojgILDSxQ8EeAU7C4SMf2lk8ivnAMiapk+PACtj/6hMROIniOjtO8/4zYDdwAg5++luP4It6zwXAdqC/RuUmtUn4+tgkIjDcEcVVYJR4j4LeC+yD0e+BbhjwS1VwE7DVMzQocheYAr9fvCICYxEozgMpwtAbYC4MFTvd0hFDEopTQC/xKB+YgRh+SSK67nOzhsQDICkYJEjYTxL7VSWF42skDTKCLzGMUxih6DwFxsD4u2BPOxAPzQ5uA3HKbcrGKMRTapWRTEGC6mNqKEhwZshvKsfhkQiOUz9pBHtK23jxfA2MPQzlZJD9rxG3x3O82tnvaqFMk7qjYTK5PcrxGGbx/m0jycnJPXD9VjYsfI1L4TJNRwamca+lSkxhYWG1mpE0zYBXEGZLjgKOS5U0WbVk2ziHbITVGpjjOSfbiiQi1xM3wnQhKONKbLBChMRqBkC7FeFhnsLQuJMhV3qB0rGJK1ZmJEoovLf5MjnAVKALlzkO6ljFFWW3+fDbxuBYm9+B1PEqLg+RWnG/q43BRza/A6ljFVetJFItFOJtDC4Bavi6hn87pWMVV7UkUi4URtt0hbd5ik3bPr34tyM6NnGVy16Lps1zFIWZwE4bMjQLfREMHRGXKsUyI3lCYSi6xhHhNIBwPEPF7bwGRHjjoFQobQmzwVDGU6pueKjdb5ZQTMdXcIdJNiiOdHE7y2wan6Pp/rJho3uISZD/bE03naMlgjT9QLFevNATyIWxdiEiQX5zOQ5V1nO82owQmYsa9hOZTGSQSUQyiYmylnCchikRllVAhbhHG9aFMB4TJBKDuPpMF48qOD7DlgjY1vK2S5V4NAa4DyezHCZB9ss01amKV621tttBwuAAFFcM/Z4sLTm3wWhZAAnQGLFHs6dGQpvhw+HviXzg7SY2TR/OAGaDYz6vJ/Jl4/My+DYceIYJAY+Q7SHwUekTEaXnOACstHBEX+yyoRwrwOl7k65UPVagNUhnL3mT7UlyCe7LQc8kFIe8mBl75JvR+Hykg581cCmIHPOLCJOhSeYio377v28IhpYPQIKabatNbKuZ6k+ANsvieCvmLH9xf4TepyMMb7Zluxn1J2fe91pNHLjcRsPj6WiLVyjgf8fT9d+n6CvstMX1PGADNWwbt5PxzjWfq1YTyXnO2ck4eft7zm52hCben8LTpVQTlXuwM9JxIgH8IAko1nG7bK8ucUEk5r8hIrpt6v6Xc++3GkSyGxFpDtLy30EtRBySPwIMACKUEyE6TctsAAAAAElFTkSuQmCC"); | ||
215 | - background-size:100% 100%; | 242 | + @include rem-sprite($index, talk); |
216 | position: relative; | 243 | position: relative; |
217 | top: .36rem; | 244 | top: .36rem; |
218 | margin-right: pxToRem(12px); | 245 | margin-right: pxToRem(12px); |
219 | } | 246 | } |
247 | + | ||
220 | &.highlight { | 248 | &.highlight { |
221 | background: #eee; | 249 | background: #eee; |
222 | } | 250 | } |
1 | $vip: sprite-map("me/vip/*.png", $spacing: 10px); | 1 | $vip: sprite-map("me/vip/*.png", $spacing: 10px); |
2 | $fav: sprite-map("me/fav/*.png", $spacing: 5px); | 2 | $fav: sprite-map("me/fav/*.png", $spacing: 5px); |
3 | +$index: sprite-map("me/index/*.png", $spacing: 5px); | ||
3 | 4 | ||
4 | @import "home", "vip-grade", "order", "order-detail", "coupons", "personal-details", "yoho-coin", "fav", "suggest", "address", "online-service", "my-guang", "ihelp", "browse-record", "logistic", "pay","yoho-coin-new", "yoho-coin-detail"; | 5 | @import "home", "vip-grade", "order", "order-detail", "coupons", "personal-details", "yoho-coin", "fav", "suggest", "address", "online-service", "my-guang", "ihelp", "browse-record", "logistic", "pay","yoho-coin-new", "yoho-coin-detail"; |
@@ -33,6 +33,16 @@ | @@ -33,6 +33,16 @@ | ||
33 | <p>浏览记录</p> | 33 | <p>浏览记录</p> |
34 | </a> | 34 | </a> |
35 | </div> | 35 | </div> |
36 | + {{#if notice}} | ||
37 | + <div class="notice"> | ||
38 | + {{#notice}} | ||
39 | + <a class="notice-item item-{{@index}}" href="{{url}}"> | ||
40 | + <span class="notice-icon"></span> | ||
41 | + {{title}} | ||
42 | + </a> | ||
43 | + {{/notice}} | ||
44 | + </div> | ||
45 | + {{/if}} | ||
36 | <div class="my-order"> | 46 | <div class="my-order"> |
37 | <a class="order-title" href="/home/orders"> | 47 | <a class="order-title" href="/home/orders"> |
38 | 我的订单 | 48 | 我的订单 |
@@ -51,6 +51,24 @@ class HomeController extends AbstractAction | @@ -51,6 +51,24 @@ class HomeController extends AbstractAction | ||
51 | 'myIndexPage' => true, | 51 | 'myIndexPage' => true, |
52 | 'showDownloadApp' => true, | 52 | 'showDownloadApp' => true, |
53 | 'navHome' => true, | 53 | 'navHome' => true, |
54 | + 'notice' => array( | ||
55 | + array( | ||
56 | + 'title' => '1. 通知内容内容通知内容内容通知内容内容通知内容内容通知内容内容', | ||
57 | + 'url' => 'http://www.yoho.cn' | ||
58 | + ), | ||
59 | + array( | ||
60 | + 'title' => '2. 通知内容内容通知内容内容通知内容内容通知内容内容通知内容内容', | ||
61 | + 'url' => 'http://www.yoho.cn' | ||
62 | + ), | ||
63 | + array( | ||
64 | + 'title' => '3. 通知内容内容通知内容内容通知内容内容通知内容内容通知内容内容', | ||
65 | + 'url' => 'http://www.yoho.cn' | ||
66 | + ), | ||
67 | + array( | ||
68 | + 'title' => '4. 通知内容内容通知内容内容通知内容内容通知内容内容通知内容内容', | ||
69 | + 'url' => 'http://www.yoho.cn' | ||
70 | + ) | ||
71 | + ), | ||
54 | 'pageFooter' => true, | 72 | 'pageFooter' => true, |
55 | 'cartUrl' => Helpers::url('/cart/index/index', null), | 73 | 'cartUrl' => Helpers::url('/cart/index/index', null), |
56 | 'signinUrl' => Helpers::url('/signin.html', array('refer' => Helpers::url('/home'))), | 74 | 'signinUrl' => Helpers::url('/signin.html', array('refer' => Helpers::url('/home'))), |
-
Please register or login to post a comment