fe / yohobuy-mobile · Commits

Go to a project

Authored by unknown
Commit 74fe571d022306ba70d9354d98f157f5e5e2f8da 1 parent f1ec2a06

商品分类html css

Inline Side-by-side
Showing 8 changed files with 277 additions and 1 deletions
... ... @@ -40,4 +40,9 @@
<script>
seajs.use('public/js/public');
</script>
{{# module}}
<script type="text/javascript">
seajs.use('public/js/{{../module}}');
</script>
{{/ module}}
</html>
\ No newline at end of file
... ...
/**
* 商品分类数据结构
* @author: liuyue(yue.liu@yoho.cn)
* @date: 2015/9/7
*/
module.exports = {
header: {
title: '商品分类'
},
searchUrl: 'www.baidu.com',
cateNav: {
list: [{
textEn: 'Boy'
}, {
textEn: 'Girl'
}, {
textEn: 'Kids'
}, {
textEn: 'Lifestyle'
}]
},
cateFirst: [{
list: [{
textCn: '上衣'
}, {
textCn: '裤装'
}, {
textCn: '裙装'
}, {
textCn: '鞋靴'
}, {
textCn: '包类'
}, {
textCn: '服配'
}],
cateSecond: [{
list: [{
textCn: '全部上衣',
url: ''
}, {
textCn: 'T恤',
url: ''
}, {
textCn: '衬衫',
url: ''
}, {
textCn: 'POLO',
url: ''
}, {
textCn: '卫衣',
url: ''
}, {
textCn: 'T恤',
url: ''
}, {
textCn: '衬衫',
url: ''
}, {
textCn: 'POLO',
url: ''
}, {
textCn: '卫衣',
url: ''
}, {
textCn: 'POLO',
url: ''
}, {
textCn: '卫衣',
url: ''
}, {
textCn: 'T恤',
url: ''
}, {
textCn: '衬衫',
url: ''
}, {
textCn: 'POLO',
url: ''
}, {
textCn: '卫衣',
url: ''
}]
}, {
list: [{
textCn: '全部上衣',
url: ''
}, {
textCn: 'T恤',
url: ''
}, {
textCn: '衬衫',
url: ''
}, {
textCn: '卫衣',
url: ''
}]
}]
}, {
list: [{
textCn: '上衣'
}, {
textCn: '裤装'
}, {
textCn: '裙装'
}, {
textCn: '鞋靴'
}, {
textCn: '包类'
}, {
textCn: '创意市集'
}],
cateSecond: [{
list: [{
textCn: '全部上衣',
url: ''
}, {
textCn: 'T恤',
url: ''
}, {
textCn: '衬衫',
url: ''
}, {
textCn: 'POLO',
url: ''
}, {
textCn: '卫衣',
url: ''
}, {
textCn: 'T恤',
url: ''
}, {
textCn: '衬衫',
url: ''
}, {
textCn: 'POLO',
url: ''
}, {
textCn: '卫衣',
url: ''
}, {
textCn: 'T恤',
url: ''
}, {
textCn: '衬衫',
url: ''
}, {
textCn: 'POLO',
url: ''
}, {
textCn: '卫衣',
url: ''
}]
}, {
list: [{
textCn: '全部上衣',
url: ''
}, {
textCn: 'T恤',
url: ''
}, {
textCn: '衬衫',
url: ''
}, {
textCn: '卫衣',
url: ''
}]
}]
}],
}
\ No newline at end of file
... ...
/**
* 商品分类js
* @author: liuyue(yue.liu@yoho.cn)
* @date: 2015/9/7
*/
var $ = require('yoho.jquery');
//主导航样式及点击事件
$('.cate-nav').find('li').eq(0).addClass('current');
$('.cate-nav').on('click', 'li', function() {
var nowIndex = $(this).index();
$(this).addClass('current').siblings().removeClass('current');
$('.cate-main').hide().eq(nowIndex).show();
});
//主体内容显示控制
$('.cate-main').eq(0).show();
//一级导航样式及点击事件
$('.cate-first').each(function() {
$(this).find('li').eq(0).addClass('current');
$(this).on('click', 'li', function() {
var nowIndex = $(this).index();
$(this).addClass('current').siblings().removeClass('current');
$(this).parents('.cate-main').find('.cate-second-section').hide().eq(nowIndex).show();
});
});
//设置二级导航高度，出现滚动条
$('.cate-second').height($(window).height() - $('.cate-second').offset().top);
\ No newline at end of file
... ...
... ... @@ -8,16 +8,19 @@ var controllerPath = './views/controller/',
boys = require(controllerPath + 'boys'),
girls = require(controllerPath + 'girls'),
goods = require(controllerPath + 'goods'),
kids = require(controllerPath + 'kids')
kids = require(controllerPath + 'kids'),
goodsCate = require(controllerPath + 'goods-cate');
module.exports = function(app) {
app.get('/boys', boys.index); //boys首页
app.get('/girls', girls.index); //girls首页
app.get('/kids', kids.index); //girls首页
app.get('/goods-cate', goodsCate.index);
app.get('/common/goodinfo', goods.goodTpl); //商品信息模板
app.get('/goods/more', goods.more); //下拉加载更多
app.get('/goods/prise', goods.like); //商品收藏/取消收藏
app.get('/goods/cancelprise', goods.like);
};
\ No newline at end of file
... ...
/**
* 商品分类控制器
* @author: liuyue(yue.liu@yoho.cn)
* @date: 2015/9/7
*/
var data = require('../../public/js/data/goods-cate'),
layoutPath = '../layouts/layout';
// 首页
exports.index = function(req, res) {
res.render('pages/goods-cate', {
data: data,
layout: layoutPath,
module: 'goods-cate'
});
};
\ No newline at end of file
... ...
{{# data}}
{{> common/header}}
{{> common/search}}
{{# cateNav}}
<div class="cate-nav">
<ul class="clearfix">
{{# list}}
<li>
<a href="javascript:;"><span>{{textEn}}</span></a>
</li>
{{/ list}}
</ul>
</div>
{{/ cateNav}}
{{# cateFirst}}
<div class="cate-main clearfix">
<ul class="cate-first">
{{# list}}
<li>
<a href="javascript:;">{{textCn}}</a>
</li>
{{/ list}}
</ul>
<div class="cate-second">
{{# cateSecond}}
<ul class="cate-second-section">
{{# list}}
<li>
<a href="{{url}}">{{textCn}}</a>
</li>
{{/ list}}
</ul>
{{/ cateSecond}}
</div>
</div>
{{/ cateFirst}}
{{/ data}}
\ No newline at end of file
... ...
{{# header}}
<div id="header" class="header clearfix">
<a class="icon-back iconfont" href="javascript:;"></a>
{{title}}
<a class="icon-home iconfont" href="www.yohobuy.com"></a>
</div>
{{/ header}}
\ No newline at end of file
... ...
<div class="search-input">
<a href="{{searchUrl}}">
<i class="search-icon iconfont">&#xe60f;</i>
<input type="text" placeholder="搜索商品">
</a>
</div>
\ No newline at end of file
... ...