Authored by unknown

侧栏导航html css

... ... @@ -52,7 +52,8 @@ module.exports = {
}, {
textCn: '只看男生',
textEn: 'Boys',
url: ''
url: '',
isSelect: true
}, {
textCn: '只看女生',
textEn: 'Girls',
... ...
... ... @@ -16,67 +16,53 @@ module.exports = {
searchUrl: '',
sideNav: [{
textCn: '男生',
textEn: 'Boys',
url: false,
subNav: {
list: [{
textCn: '男生',
textEn: 'Boys',
img: '',
url: false
}, {
textCn: '首页',
img: 'http://res.yohoboys.com/res/new/boys/images/about/thirdbtn-sina.png',
url: ''
}, {
textCn: '新品到着',
img: '',
url: ''
}]
}
textEn: 'BOYS',
styleClass: 'boys',
url: ''
}, {
textCn: '女生',
textEn: 'Girls',
current: true,
url: false,
textEn: 'GIRLS',
styleClass: 'girls',
url: ''
}, {
textCn: '潮童',
textEn: 'KIDS',
styleClass: 'kids',
url: ''
}, {
textCn: '创意生活',
textEn: 'LIFE STYLE',
styleClass: 'life',
url: ''
}, {
textCn: '新品节',
textEn: 'NEW',
styleClass: 'new',
url: ''
}, {
textCn: '逛',
textEn: 'TRENDFINDER',
styleClass: 'guang',
subNav: {
list: [{
textCn: '女生',
textEn: 'Girls',
img: '',
url: false
}, {
textCn: '首页',
img: '',
url: ''
}, {
textCn: '新品到着',
img: '',
url: ''
}, {
textCn: '上衣',
img: '',
url: ''
textCn: '逛',
textEn: 'TrendFinder',
back: true,
bgColor: '#fd307f'
}, {
textCn: '鞋靴',
img: '',
textCn: '查看全部',
url: ''
}, {
textCn: '裤装',
img: '',
textCn: '只看男生',
textEn: 'Boys',
url: ''
}, {
textCn: '品牌一览',
img: '',
url: ''
textCn: '只看女生',
textEn: 'Girls',
url: '',
isSelect: true
}]
}
}, {
textCn: '潮童',
textEn: 'Kids'
}, {
textCn: '家居',
textEn: 'Life Style'
}],
content: [{
bannerTop: {
... ...
... ... @@ -172,10 +172,10 @@
height: 87rem / $pxConvertRem;
background: image-url("yohologo02.png") no-repeat center center;
background-size: 100%;
animation: 60s turn infinite;
-webkit-animation: 60s turn infinite;
-moz-animation: 60s turn infinite;
-o-animation: 60s turn infinite;
animation: 60s turn infinite ease-out;
-webkit-animation: 60s turn infinite ease-out;
-moz-animation: 60s turn infinite ease-out;
-o-animation: 60s turn infinite ease-out;
}
.logo.animate{
background: image-url("yohologo01.png") no-repeat center center;
... ...
... ... @@ -95,7 +95,7 @@
}
li.guang, li.trendfinder {
i {
.nav-icon {
background: image-url("side-nav/guang.png") no-repeat left center;
background-size: 100% 100%;
}
... ... @@ -156,7 +156,7 @@
}
}
li:hover {
li:hover, li.current {
.nav-point {
color: #3e3e3e;
}
... ...
... ... @@ -22,7 +22,7 @@
{{# subNav}}
<ul class="sub-nav">
{{# list}}
<li>
<li class="{{# isSelect}}current{{/ isSelect}}" style="background-color:{{bgColor}}">
{{# url}}
<a href="{{.}}">
{{/ url}}
... ...