Authored by unknown

Merge branch 'web' of http://git.dev.yoho.cn/web/yohobuy into web

Too many changes to show.

To preserve performance only 34 of 34+ files are displayed.

... ... @@ -2,8 +2,49 @@
## 公共定义
### 公共底部
{
footerTop: true //是否显示足部有货services,意见反馈和更多YOHO产品等模块
}
### 商品
{
skn: 1,
thumb: 'path/to/goods/img',
url: '',
name: '',
salePrice: 500, //售价
marketPrice: 1000, //市场价
tags: [
{
isNew: true //NEW
},
{
isSale: true //SALE
},
{
isLimit: false //限量商品
},
{
isNewFestival: true //新品节
},
{
isReNew: true //再到着
},
{
isYearEndPromotion: true //年终大促
},
{
isYearMidPromotion: true // 年中大促
}
],
isFew: true, //即将售罄
showColBtn: true, //是否显示收藏按钮
coled: true //已收藏
}
### 路径导航
{
... ... @@ -195,7 +236,7 @@
## 搜索页
{
products: {
search: {
//路径导航
pathNav: [...],
... ... @@ -381,10 +422,166 @@
preHref: '', //若当前为第一页,不传此参数
nexHref: '' //若当前为最后一页,不传此参数
},
// 商品导航列表
allSort: {
//全部品类
updateNum: 2, //更新总数
list: [
{
name: 'AA', //一级分类
num: 12 //一级分类更新数目
childList: [
{
name: 'AAA', //二级分类
href: '##', //二级分类跳转链接
num: 12 //二级分类更新数目
}
]
}
]
},
advNav: {
//图片导航
advNavTitle: 'AA', 图片导航标题
list: [
{
href: '',
src: '' // 图片地址
}
]
},
advPic: {
//图片banner
advPicTitle: 'AA', 图片banner标题
list: [
{
href: '',
src: '' // 图片地址
}
]
},
newSales: {
//一周新品上架
updateNum: 123,
list: [
{
name: 'AAA',
href: '',
num: 12,
}
]
},
allDiscount: {
//全部折扣
updateNum: 111,
list: [
{
name: 'VVV',
href: '##',
num: 11
}
]
}
//商品列表
goods: [
//商品信息
...
]
}
}
## 站点头部
{
gobuytype: 'gobuyboys',//购物车样式
searchcate: 'searchcateboys', //搜索栏样式
navbars: [{//一级导航
name_cn: '男生',
name_en: 'BOYS',
link: '',
classname: 'boys',
index_main: 0,
subnav: [{
name: '新品到着',
link: '',
index_sub:0,
thirdnav: [
{
title: '上装',
branditems: [
{
brandname: '背心',
link: ''
},
{
brandname: 'T恤',
link: ''
},
{
brandname: '衬衫',
link: ''
},
{
brandname: 'POLO',
link: ''
},
{
brandname: '毛衣/针织',
link: ''
}]
}
]
}, {
name: '品牌一览',
link: '',
thirdnav: []
}]
}],
myyoho: {
email: 'caomei@163.com',
viptype: '普通会员',
currentscore: 495,
totalscore: 600,
cardtype: '银卡',
infolist: [{
name: '待处理的订单',
link: '',
num: '0'
}, {
name: '我的收藏',
link: '',
num: '1'
}, {
name: '我的优惠券',
link: '',
num: '2'
}, {
name: '我的YOHO币',
link: '',
num: '1'
}, {
name: '我的退货换货',
link: '',
num: '1'
}],
updlink: ''
},
gobuy: {
gobuynum: 3
},
breadcrumbnav: [{
notend: {
link: 'http://www.yohobuy.com',
name: 'BOYS首页'
}
}, {
notend: {
link: 'http://www.yohobuy.com',
name: '上衣'
}
}, {
isend: {
link: 'http://list.yohobuy.com/?msort=1&gender=1,3',
name: '衬衫'
}
}]
}
\ No newline at end of file
... ...
No preview for this file type
{{> layout/header}}
<div class="products-page yoho-page">
{{# products}}
{{> layout/path-nav}}
<div class="filter-box">
{{# filters}}
{{# checkedConditions}}
<div class="checked-conditions section">
<span class="title">已选条件:</span>
<div class="product-list-page yoho-page">
{{# list}}
{{# brandBanner}}
<div class="brand-banner">
<div class="banner-img" style="height: {{bannerHeight}}px;background: url({{banner}})"></div>
<div class="opt-wrap">
<p class="opt center-content">
<a href="{{brandHome}}">
<i class="iconfont">&#xe617;</i>
品牌首页
</a>
<a href="{{brandIntro}}">
<i class="iconfont">&#xe618;</i>
品牌介绍
</a>
<span id="brand-favor" class="brand-favor">
<i class="iconfont{{#if coled}} coled{{/if}}">&#xe616;</i>
</span>
</p>
</div>
</div>
{{/ brandBanner}}
<div class="attr-content clearfix">
{{#each conditions}}
<a class="tag" href="{{href}}">
{{#if name}}
{{name}}
{{^}}
<i class="color-block" style="background: {{color}}"></i>
{{/if}}
<i class="close iconfont">&#xe602;</i>
</a>
{{/each}}
<div class="center-content clearfix">
{{> layout/path-nav}}
<a class="clear-checked" href="{{clearUrl}}">清空筛选条件</a>
</div>
{{# brandAbout}}
<div class="brand-about">
{{{brandIntro}}}
</div>
{{^}}
<div class="list-left pull-left">
{{# allDiscount}}
<div class="sort-container">
<ul class="sort-child-list new-sale">
<li><a href="{{href}}">全部折扣</a><span>{{updateNum}}</span></li>
{{#each list}}
<li><a href="{{href}}">{{name}}</a><span>{{num}}</span></li>
{{/each}}
</ul>
</div>
{{/ checkedConditions}}
{{#if channel}}
<div class="channel section">
<span class="title">频道:</span>
<div class="attr-content clearfix">
{{#each channel}}
<a class="attr" href="{{href}}">
{{name}}
</a>
{{/ allDiscount}}
{{# newSales}}
<div class="sort-container">
<h2>一周新品上架<span>{{updateNum}}</span></h2>
<ul class="sort-child-list new-sale">
{{#each list}}
<li><a href="{{href}}">{{name}}</a><span>{{num}}</span></li>
{{/each}}
</div>
</ul>
</div>
{{/if}}
{{#if sort}}
<div class="sort section">
<span class="title">分类:</span>
{{/ newSales}}
<div class="attr-content">
<ul class="sort-pre clearfix">
{{#each sort}}
<li>
<span class="attr">
{{name}}
</span>
</li>
{{/each}}
</ul>
<div class="sort-sub-wrap">
{{#each sort}}
<ul class="sort-sub clearfix hide">
{{#each sub}}
<li class="attr">
{{# allSort}}
<div class="sort-container">
<h2>全部品类<span>{{updateNum}}</span></h2>
<ul>
{{#each list}}
<li class="product-list-nav">
<h3>
<span class="icon-triangle"></span>
{{name}}<span>{{num}}</span>
</h3>
<ul class="sort-child-list">
{{#each childList}}
<li>
<a href="{{href}}">{{name}}</a>
<span>{{num}}</span>
</li>
{{/each}}
</ul>
{{/each}}
</div>
</div>
</div>
{{/if}}
{{# brand}}
<div class="brand section">
<span class="title">品牌:</span>
<div class="attr-content">
<ul class="default clearfix">
{{# default}}
<li class="attr">
<a href="{{href}}" title="{{name}}">{{name}}</a>
</li>
{{/ default}}
</ul>
<div class="brand-opt">
<span id="brand-more" class="brand-more">
<em>更多</em>
<i class="iconfont">&#xe600;</i>
</span>
<span id="brand-multi" class="multi-select">多选 +</span>
</div>
<div class="brand-panel hide">
<div class="panel-head clearfix">
<p class="brands-index">
{{#each brandIndex}}
<span data-index="{{index}}">{{name}}</span>
{{/each}}
</p>
<div class="brand-search">
<input id="brand-search-input" type="text">
<span class="btn">
<i class="iconfont">&#xe611;</i>
</span>
</div>
</div>
<ul class="panel-body check-container clearfix">
{{# brandsShow}}
<li class="attr" data-index="{{index}}" data-key="{{key}}">
<a href="{{href}}">
<span class="iconfont checkbox" data-id="{{id}}">&#xe613;</span>
<span title="{{name}}">{{name}}</span>
</a>
</li>
{{/ brandsShow}}
</ul>
<div class="btns">
<button id="brand-multi-ok" class="multi-select-ok dis">确定</button>
<button class="multi-select-cancel">取消</button>
</div>
</div>
</div>
</div>
{{/ brand}}
{{#if price}}
<div class="price section">
<span class="title">价格:</span>
<div class="attr-content clearfix">
{{# price}}
<a class="attr" href="{{href}}"{{name}}</a>
{{/ price}}
<div class="ud-price-range">
¥
<input type="text" class="min limit">
<span class="price-sep">-</span>
<input type="text" class="max limit">
<button class="price-sure hide">确定</button>
</div>
</div>
</div>
{{/if}}
{{#if color}}
<div class="color section">
<span class="title">颜色:</span>
<div class="attr-content clearfix">
{{# color}}
<a class="attr" href="{{href}}">
<i class="color-block" style="background: {{rgb}}"></i>
{{name}}
</a>
{{/ color}}
</div>
</div>
{{/if}}
{{#if size}}
<div class="size section">
<span class="title">尺码:</span>
<div class="attr-content clearfix">
{{# size}}
<a class="attr" href="{{href}}">{{name}}</a>
{{/ size}}
</div>
</div>
{{/if}}
{{#if seniorChose}}
<div class="senior section">
<span class="title">高级选项:</span>
<div class="attr-content">
<ul class="clearfix senior-attr-wrap">
{{#each seniorChose}}
<li class="attr">
{{name}}
<span class="iconfont">&#xe600;</span>
<div class="senior-up-icon"></div>
</li>
{{/each}}
</ul>
<div class="senior-sub-wrap">
{{#each seniorChose}}
<div class="senior-sub hide" data-attr="{{attr}}">
{{#if showMulti}}
<span class="multi-select">多选 +</span>
{{/if}}
<ul class="clearfix check-container">
{{#each sub}}
<li class="attr">
<a href="{{href}}">
<span class="iconfont checkbox" data-id="{{id}}">&#xe613;</span>
<span>{{name}}</span>
</a>
</li>
{{/each}}
</ul>
<div class="btns">
<button class="multi-select-ok dis">确定</button>
<button class="multi-select-cancel">取消</button>
</div>
</div>
{{/each}}
</div>
</div>
</div>
{{/if}}
{{/ filters}}
</div>
<div class="opt-banner">
{{# opts}}
{{# sortType}}
<a class="sort-type{{#if active}} active{{/if}}" href="{{href}}">
{{name}}
{{#if hasSortOrient}}
{{#if active}}
{{#if desc}}
<span class="active-icon iconfont">&#xe603;</span>
{{^}}
<span class="active-icon iconfont">&#xe604;</span>
{{/if}}
{{^}}
<span class="iconfont">&#xe614;</span>
{{/if}}
{{^}}
<span class="iconfont">&#xe604;</span>
{{/if}}
</a>
{{/ sortType}}
{{# checks}}
<a class="checks{{#if checked}} checked{{/if}}" href="{{href}}">
{{#if checked}}
<span class="iconfont">&#xe612;</span>
{{^}}
<span class="iconfont">&#xe613;</span>
{{/if}}
{{name}}
</a>
{{/ checks}}
<div class="pager-wrap">
{{#if fivePerLine}}
<div class="line-count active">
<span></span>
<span></span>
<span></span>
<span></span>
<span></span>
</div>
<a class="line-count" href="{{sixPerLineHref}}">
<span></span>
<span></span>
<span></span>
<span></span>
<span></span>
<span></span>
</a>
{{^}}
<a class="line-count" href="{{fivePerLineHref}}">
<span></span>
<span></span>
<span></span>
<span></span>
<span></span>
</a>
<div class="line-count active">
<span></span>
<span></span>
<span></span>
<span></span>
<span></span>
<span></span>
</div>
{{/if}}
<div class="page-count">
<span id="count-per-page">
{{countPerPage}}
<i class="iconfont">&#xe604;</i>
</span>
每页
<ul>
{{# pageCounts}}
<li>
<a href="{{href}}">{{count}}</a>
</li>
{{/ pageCounts}}
{{/each}}
</ul>
</div>
<p class="pager">
{{#if preHref}}
<a href="{{preHref}}">
<span class="iconfont">&#xe615;</span>
{{/ allSort}}
{{# advNav}}
{{# advNavTitle}}
<h2 class="nav-pic-title">{{.}}</h2>
{{/advNavTitle}}
<ul class="pic-nav">
{{#each list}}
<li><a href="{{href}}"><img src="{{src}}" alt=""/></a></li>
{{/each}}
</ul>
{{/advNav}}
{{#advPic}}
{{# advPicTitle}}
<h2 class="nav-pic-title">{{.}}</h2>
{{/ advPicTitle}}
<ul class="pic-nav">
{{#each list}}
<li><a href="{{href}}"><img src="{{src}}" alt=""/></a></li>
{{/each}}
</ul>
{{/advPic}}
</div>
<div class="list-right pull-right">
{{# shopEntry}}
<div class="shop-entry clearfix">
<a class="pull-left" href="{{home}}">
<img class="logo" src="{{logo}}">
</a>
{{^}}
<span class="dis-icon iconfont">&#xe615;</span>
{{/if}}
<span>
<i>{{curPage}}</i>/{{pageCount}}
</span>
<div class="name pull-left">
<a class="shop-name" href="{{home}}">{{shopName}}</a>
<p class="sorts">
{{#each sort}}
<a href="{{href}}">{{name}}</a>
{{#unless @last}}
/
{{/unless}}
{{/each}}
</p>
</div>
{{#if nextHref}}
<a href="{{nextHref}}">
<a class="entry-btn pull-right" href="{{home}}">
进入品牌店铺
<span class="iconfont">&#xe601;</span>
</a>
{{^}}
<span class="dis-icon iconfont">&#xe601;</span>
{{/if}}
</p>
</div>
{{/ shopEntry}}
{{# filters}}
{{> product/filter-box}}
{{/ filters}}
{{# opts}}
{{> product/sort-pager}}
{{/ opts}}
<div class="goods-container clearfix">
{{#each goods}}
{{> product/good}}
{{/each}}
<div class="good-item-wrapper">
<div class="good-info-main"></div>
<div class="good-select-color"></div>
</div>
</div>
</div>
{{/opts}}
</div>
<div class="goods-container clearfix{{#if opts.sixPerLine}} six-per-line{{/if}}">
{{#each goods}}
{{> product/good}}
{{/each}}
<div class="good-item-wrapper">
<div class="good-info-main"></div>
<div class="good-select-color"></div>
</div>
{{/ brandAbout}}
</div>
{{/ products}}
{{/ list}}
</div>
{{> layout/footer}}
\ No newline at end of file
... ...
{{> layout/header}}
<div class="product-search-page yoho-page center-content">
{{# search}}
{{> layout/path-nav}}
{{# filters}}
{{> product/filter-box}}
{{/ filters}}
{{# opts}}
{{> product/sort-pager}}
{{/ opts}}
<div class="goods-container clearfix">
{{#each goods}}
{{> product/good}}
{{/each}}
<div class="good-item-wrapper">
<div class="good-info-main"></div>
<div class="good-select-color"></div>
</div>
</div>
{{/ search}}
</div>
{{> layout/footer}}
\ No newline at end of file
... ...
<div class="yoho-footer">
<div class="footertop">
<div class="index-foot">
<dl class="clearfix screen">
<dd>
<div class="foot-panel">
<div class="title relative">
<div class="title-line"></div>
<div class="text">
<span>有货SERVICES</span>
{{#if footerTop}}
<div class="footertop">
<div class="index-foot">
<dl class="center-content clearfix">
<dd>
<div class="foot-panel">
<div class="title">
<div class="title-line"></div>
<div class="text">
<span>有货SERVICES</span>
</div>
</div>
</div>
<div id="foot-services">
<ul class="clearfix two-dim">
<li class="left">
<div class="">
<a href="javascript:void(0);">
<img class="dim-img lazy" data-original="http://img11.static.yhbimg.com/adpic/2014/03/20/16/01863b297051f11c2be833785566cf11d1.png" src="http://img11.static.yhbimg.com/adpic/2014/03/20/16/01863b297051f11c2be833785566cf11d1.png" style=""></a>
<div id="foot-services">
<ul class="two-dim clearfix">
<li class="left">
<img class="dim-img lazy" data-original="http://img11.static.yhbimg.com/adpic/2014/03/20/16/01863b297051f11c2be833785566cf11d1.png">
<p>YOHO!有货</p>
</div>
</li>
<li class="left">
<div class="">
<a href="javascript:void(0);">
<img class="dim-img lazy" data-original="http://img12.static.yhbimg.com/adpic/2014/04/11/14/022ddc2b6d6b2fcabee8cdc03735e5687e.jpg" src="http://img12.static.yhbimg.com/adpic/2014/04/11/14/022ddc2b6d6b2fcabee8cdc03735e5687e.jpg" style=""></a>
</li>
<li class="left">
<img class="dim-img lazy" data-original="http://img12.static.yhbimg.com/adpic/2014/04/11/14/022ddc2b6d6b2fcabee8cdc03735e5687e.jpg">
<p>微信</p>
</div>
</li>
<li class="left">
<div class="">
<a href="javascript:void(0);">
<img class="dim-img lazy" data-original="http://img13.static.yhbimg.com/adpic/2014/03/20/16/02e69d0afa222cf173d17411fd04be380e.png" src="http://img13.static.yhbimg.com/adpic/2014/03/20/16/02e69d0afa222cf173d17411fd04be380e.png" style="display: inline;"></a>
</li>
<li class="left">
<img class="dim-img lazy" data-original="http://img13.static.yhbimg.com/adpic/2014/03/20/16/02e69d0afa222cf173d17411fd04be380e.png">
<p>微博</p>
</div>
</li>
</ul>
</div>
</div>
<p class="item-nav center" id="button-services">
<a href="javascript:void(0);" key="0">
<span class="ifont10 cur">O</span>
</a>
</p>
</dd>
<dd>
<div class="foot-panel" id="feedbackBoxList">
<div class="title relative">
<div class="title-line"></div>
<div class="text">
<span>意见反馈</span>
</li>
</ul>
</div>
</div>
<ul class="clearfix vote">
<li style="display:block" key="0">
<form action="#" id="feedbackForm">
<input type="hidden" name="question_id" id="question_id" value="38">
<input type="hidden" name="feedback_id" id="feedback_id" value="5">
<div>您喜欢有货的新版吗?</div>
<div class="vote-item clearfix">
<p>
<input type="radio" name="solution" value="33">非常喜欢</p>
<p>
<input type="radio" name="solution" value="34">喜欢</p>
<p>
<input type="radio" name="solution" value="35">一般般</p>
<p>
<input type="radio" name="solution" value="36">不喜欢</p>
<p>
<input type="radio" name="solution" value="37">非常不喜欢</p>
</div>
<div>
<a href="javascript:void(0);" id="feedbackBtn" class="button">提交</a>
</div>
</form>
</li>
<li style="display:none" key="1">
<form action="#" id="feedbackForm">
<input type="hidden" name="question_id" id="question_id" value="39">
<input type="hidden" name="feedback_id" id="feedback_id" value="5">
<div>您可以方便的找到想查看的内容吗?</div>
<div class="vote-item clearfix">
<p>
<input type="radio" name="solution" value="38">非常方便</p>
<p>
<input type="radio" name="solution" value="39">方便</p>
<p>
<input type="radio" name="solution" value="40">一般般</p>
<p>
<input type="radio" name="solution" value="41">不方便</p>
<p>
<input type="radio" name="solution" value="42">非常不方便</p>
</div>
<div>
<a href="javascript:void(0);" id="feedbackBtn" class="button">提交</a>
</div>
</form>
</li>
<li style="display:none" key="2">
<form action="#" id="feedbackForm">
<input type="hidden" name="question_id" id="question_id" value="37">
<input type="hidden" name="feedback_id" id="feedback_id" value="5">
<div>您对新版还有哪些意见或建议?</div>
<textarea name="answer" id="feedback_answer"></textarea>
<div>
<a href="javascript:void(0);" id="feedbackBtn" class="button">提交</a>
</div>
</form>
</li>
</ul>
</div>
<p class="item-nav center" id="feedbackPage">
<a href="javascript:void(0);">
<span class="ifont10 cur">O</span>
</a>
<a href="javascript:void(0);">
<span class="ifont10 ">o</span>
</a>
<a href="javascript:void(0);">
<span class="ifont10 ">o</span>
</a>
</p>
</dd>
<dd class="last">
<div class="foot-panel">
<div class="title relative">
<div class="title-line"></div>
<div class="text">
<span>更多 YOHO!产品</span>
<p class="item-nav center">
<span class="iconfont cur" key="0">&#xe619;</span>
</p>
</dd>
<dd>
<div id="feed-back-box-list" class="foot-panel">
<div class="title">
<div class="title-line"></div>
<div class="text">
<span>意见反馈</span>
</div>
</div>
</div>
<div id="foot-mobile">
<ul class="clearfix mobile">
<li>
<a href="http://app.yohoshow.com/" target="_blank" titl="">
<img alt="" data-original="http://img13.static.yhbimg.com/adpic/2014/07/21/15/02d5e1cbc15ab59856f4a758fa860462ed.jpg" class="lazy" src="http://img13.static.yhbimg.com/adpic/2014/07/21/15/02d5e1cbc15ab59856f4a758fa860462ed.jpg" style=""></a>
<ul class="vote clearfix">
<li key="0">
<form class="feed-back-form" action="#">
<div>您喜欢有货的新版吗?</div>
<div class="vote-item clearfix">
<p>
<input type="radio" name="solution" value="33">非常喜欢
</p>
<p>
<input type="radio" name="solution" value="34">喜欢
</p>
<p>
<input type="radio" name="solution" value="35">一般般
</p>
<p>
<input type="radio" name="solution" value="36">不喜欢
</p>
<p>
<input type="radio" name="solution" value="37">非常不喜欢
</p>
</div>
<div>
<span class="feed-back-btn button">提交</span>
</div>
<input class="question-id" type="hidden" name="question_id" value="38">
<input class="feedback-id" type="hidden" name="feedback_id" value="5">
</form>
</li>
<li>
<a href="http://www.yohoboys.com/" target="_blank" titl="">
<img alt="" data-original="http://img13.static.yhbimg.com/adpic/2014/07/21/15/0210a3490eae2aad6ef8bf3b8133a49ca9.jpg" class="lazy" src="http://img13.static.yhbimg.com/adpic/2014/07/21/15/0210a3490eae2aad6ef8bf3b8133a49ca9.jpg" style=""></a>
<li class="hide" key="1">
<form class="feed-back-form" action="#">
<div>您可以方便的找到想查看的内容吗?</div>
<div class="vote-item clearfix">
<p>
<input type="radio" name="solution" value="38">非常方便
</p>
<p>
<input type="radio" name="solution" value="39">方便
</p>
<p>
<input type="radio" name="solution" value="40">一般般
</p>
<p>
<input type="radio" name="solution" value="41">不方便
</p>
<p>
<input type="radio" name="solution" value="42">非常不方便
</p>
</div>
<div>
<span class="feed-back-btn button">提交</span>
</div>
<input class="question-id" type="hidden" value="39">
<input class="feedback-id" type="hidden" value="5">
</form>
</li>
<li>
<a href="http://www.yohogirls.com/" target="_blank" titl="">
<img alt="" data-original="http://img11.static.yhbimg.com/adpic/2014/07/21/15/018be2a193424658b5201240ef8c7729e6.jpg" class="lazy" src="http://img11.static.yhbimg.com/adpic/2014/07/21/15/018be2a193424658b5201240ef8c7729e6.jpg" style=""></a>
<li class="hide" key="2">
<form class="feed-back-form" action="#">
<div>您对新版还有哪些意见或建议?</div>
<textarea name="answer" id="feedback-answer"></textarea>
<div>
<span class="feed-back-btn button">提交</span>
</div>
<input class="question-id" type="hidden" value="37">
<input class="feedback-id" type="hidden" value="5">
</form>
</li>
</ul>
</div>
</div>
<p class="item-nav center" id="button-mobile">
<a href="javascript:void(0);">
<span class="ifont10 cur">O</span>
</a>
</p>
</dd>
</dl>
<p id="feed-back-page" class="item-nav center">
<span class="iconfont cur">&#xe619;</span>
<span class="iconfont ">&#xe619;</span>
<span class="iconfont ">&#xe619;</span>
</p>
</dd>
<dd class="last">
<div class="foot-panel">
<div class="title">
<div class="title-line"></div>
<div class="text">
<span>更多 YOHO!产品</span>
</div>
</div>
<div id="foot-mobile">
<ul class="mobile clearfix">
<li>
<a href="http://app.yohoshow.com/" target="_blank">
<img class="lazy" data-original="http://img13.static.yhbimg.com/adpic/2014/07/21/15/02d5e1cbc15ab59856f4a758fa860462ed.jpg">
</a>
</li>
<li>
<a href="http://www.yohoboys.com/" target="_blank">
<img class="lazy" data-original="http://img13.static.yhbimg.com/adpic/2014/07/21/15/0210a3490eae2aad6ef8bf3b8133a49ca9.jpg">
</a>
</li>
<li>
<a href="http://www.yohogirls.com/" target="_blank">
<img class="lazy" data-original="http://img11.static.yhbimg.com/adpic/2014/07/21/15/018be2a193424658b5201240ef8c7729e6.jpg">
</a>
</li>
</ul>
</div>
</div>
<p class="item-nav center">
<span class="iconfont cur">&#xe619;</span>
</p>
</dd>
</dl>
</div>
</div>
</div>
{{/if}}
<div class="footerbottom">
<div class="promise">
<div class="screen clearfix">
<div class="center-content clearfix">
<div class="left">
<span class="ifont rgbf">g</span>
<span class="iconfont rgbf">g</span>
<span class="red">100%</span>
<span class="rgbf">品牌授权正品</span>
</div>
<div class="left">
<span class="ifont rgbf">L</span>
<span class="iconfont rgbf">L</span>
<span class="red">7天</span>
<span class="rgbf">无理由退换货</span>
</div>
<div class="left">
<span class="ifont rgbf">p</span>
<span class="iconfont rgbf">p</span>
<span class="rgbf">客服电话:</span>
<span class="red">400-889-9646</span>
&nbsp;&nbsp;
<span class="rgb9">08:00-22:30(周一至周日)</span>
&nbsp;&nbsp;
<span>
<a href="http://chat80.live800.com/live800/chatClient/chatbox.jsp?companyID=493979&amp;configID=123576&amp;jid=9277320930" target="_blank" style="color:red">在线客服</a>
<a class="red" href="http://chat80.live800.com/live800/chatClient/chatbox.jsp?companyID=493979&amp;configID=123576&amp;jid=9277320930" target="_blank">在线客服</a>
</span>
</div>
<div class="right subscribe footer-right">
<input class="rgb6 top" name="subscriberBox" id="subscriberBox" value="订阅我们的邮件">
<a href="javascript:void(0);" id="subscriberBtn" class="ifont rgbf">m</a>
<!--<input class="rgb6 top wrong" value="订阅我们的邮件" />
<a href="" class="ifont rgbf done">=</a>
-->
<input id="subscriber-box" class="rgb6 top" name="subscriberBox"value="订阅我们的邮件">
<a id="subscriber-btn" href="javascript:void(0);" class="ifont rgbf">m</a>
</div>
</div>
</div>
<div class="footer-help">
<div class="screen clearfix">
<div class="center-content clearfix">
<div class="left">
<ul class="clearfix">
<li class="left">
... ... @@ -315,12 +308,14 @@
</div>
</div>
<div class="footer-link">
<div class="screen clearfix">
<div class="center-content clearfix">
<div class="left right-flag">
<a href="https://ss.knet.cn/verifyseal.dll?sn=e14021832010046477dka7000000&amp;ct=df&amp;a=1&amp;pa=0.5902942178957805" target="_blank" rel="nofollow">
<img src="http://static.yohobuy.com/images/v3/icon/credit-flag3.png"></a>
<img src="http://static.yohobuy.com/images/v3/icon/credit-flag3.png">
</a>
<a href="http://www.isc.org.cn/" target="_blank" rel="nofollow">
<img src="http://static.yohobuy.com/images/v3/icon/isc2.png"></a>
<img src="http://static.yohobuy.com/images/v3/icon/isc2.png">
</a>
</div>
<div class="left about-us">
<p>
... ... @@ -340,7 +335,7 @@
</p>
<p>
CopyRight © 2007-2016 南京新与力文化传播有限公司
<a href="http://www.miibeian.gov.cn/" target="_blank" style="color:#666">苏ICP备09011225号</a>
<a class="rbg6" href="http://www.miibeian.gov.cn/" target="_blank">苏ICP备09011225号</a>
NewPower Co. 版权所有 经营许可证编号:苏B2-20120395
</p>
</div>
... ... @@ -348,4 +343,7 @@
</div>
</div>
</div>
<div class="return-top">
<span class="iconfont">&#xe610;</span>
</div>
</div>
\ No newline at end of file
... ...
... ... @@ -102,7 +102,11 @@
{{/thirdnav}}
</div>
</div>
<div class="showdetail" data-code="220eec926e0d2c48b2f7e36fb9c42b83"><a href="http://list.yohobuy.com/?gender=1,3&amp;msort=8"><img src="http://img12.static.yhbimg.com/yhb-img01/2015/10/30/06/02af834d146e3f00b1f5fcc8388f641922.jpg?imageView/1/w/337/h/250" alt="" style=""></a><a class="title" href="http://list.yohobuy.com/?gender=1,3&amp;msort=8">热门小物优选</a></div>
<div class="showdetail" data-code="220eec926e0d2c48b2f7e36fb9c42b83">
<a href="http://list.yohobuy.com/?gender=1,3&amp;msort=8">
<img src="http://img12.static.yhbimg.com/yhb-img01/2015/10/30/06/02af834d146e3f00b1f5fcc8388f641922.jpg?imageView/1/w/337/h/250" alt="" style=""></a>
<a class="title" href="http://list.yohobuy.com/?gender=1,3&amp;msort=8">热门小物优选</a>
</div>
</div>
</div>
</li>
... ... @@ -132,241 +136,163 @@
</div>
</div>
</div>
{{/headerdata}}
<div id="goodcartempwarpper">
<script type="text/html" id="mini-cart-tpl">
<div class="gobuy-notempty">
<div class="goods-list-wrapper">
\{\{#carData\}\}
<div class="gobuy-notempty">
<div class="goods-list-wrapper">
<ul class="goods-list">
%L~it.cartData.main_goods :v:index%R
\{\{#main_goods\}\}
<li class="goods-item">
<a href="%L=v.product_url%R">
<img src="%L=v.default_img%R" alt="" class="goods-img" />
<a href="\{\{product_url\}\}">
<img src="\{\{default_img\}\}" alt="" class="goods-img" />
</a>
<div class="goods-detail float-left">
<h3 class="content"><a href="%L=v.product_url%R">%L=v.product_name%R</a></h3>
<h3 class="content"><a href="\{\{product_url\}\}">\{\{product_name\}\}</a></h3>
<h3 class="style">
颜色:
<span class="color">%L=v.color_name%R</span>
<span class="color">\{\{color_name\}\}</span>
尺码:
<span class="size">%L=v.size_name%R</span>
<span class="size">\{\{size_name\}\}</span>
</h3>
</div>
<div class="goods-price float-left">
<h3 class="priceandnum">
<span class="price">%L=v.show_price%R</span>
<span class="price">\{\{show_price\}\}</span>
x
<span class="num">%L=v.buy_number%R</span>
<span class="num">\{\{buy_number\}\}</span>
</h3>
<a href="javascript:void(0)" class="delete" onclick="delCartGoods(%L=v.goods_incart_id%R,%L=v.is_cheapest_free%R);">删除</a>
<a href="javascript:void(0)" class="delete goodscardelete" goodsid=\{\{goods_incart_id\}\} cheapest=\{\{is_cheapest_free\}\}>删除</a>
</div>
</li>
%L~%R
%L~it.cartData.advance_goods :v:index%R
\{\{/main_goods\}\}
\{\{#advance_goods\}\}
<li class="goods-item">
<a href="%L=v.product_url%R">
<img src="%L=v.default_img%R" alt="" class="goods-img"></a>
<a href="\{\{product_url\}\}">
<img src="\{\{default_img\}\}" alt="" class="goods-img"></a>
<div class="goods-detail float-left">
<h3 class="content"><a href="%L=v.product_url%R">%L=v.product_name%R</a></h3>
<h3 class="content"><a href="\{\{product_url\}\}">\{\{product_name\}\}</a></h3>
<h3 class="style">
颜色:
<span class="color">%L=v.color_name%R</span>
<span class="color">\{\{color_name\}\}</span>
尺码:
<span class="size">%L=v.size_name%R</span>
<span class="size">\{\{size_name\}\}</span>
</h3>
</div>
<div class="goods-price float-left">
<h3 class="priceandnum">
<span class="price">%L=v.show_price%R</span>
<span class="price">\{\{show_price\}\}</span>
x
<span class="num">%L=v.buy_number%R</span>
<span class="num">\{\{buy_number\}\}</span>
</h3>
<a href="javascript:void(0)" class="delete" onclick="delCartGoods(%L=v.goods_incart_id%R,%L=v.is_cheapest_free%R);">删除</a>
<a href="javascript:void(0)" class="delete goodscardelete" goodsid=\{\{goods_incart_id\}\} cheapest=\{\{is_cheapest_free\}\}>删除</a>
</div>
</li>
%L~%R
%L~it.cartData.outlet_goods :v:index%R
\{\{/advance_goods\}\}
\{\{# outlet_goods\}\}
<li class="goods-item">
<a href="%L=v.product_url%R">
<img src="%L=v.default_img%R" alt="" class="goods-img"></a>
<a href="\{\{product_url\}\}">
<img src="\{\{default_img\}\}" alt="" class="goods-img"></a>
<div class="goods-detail float-left">
<h3 class="content"><a href="%L=v.product_url%R">%L=v.product_name%R</a></h3>
<h3 class="content"><a href="\{\{product_url\}\}">\{\{product_name\}\}</a></h3>
<h3 class="style">
颜色:
<span class="color">%L=v.color_name%R</span>
<span class="color">\{\{color_name\}\}</span>
尺码:
<span class="size">%L=v.size_name%R</span>
<span class="size">\{\{size_name\}\}</span>
</h3>
</div>
<div class="goods-price float-left">
<h3 class="priceandnum">
<span class="price">%L=v.show_price%R</span>
<span class="price">\{\{show_price\}\}</span>
x
<span class="num">%L=v.buy_number%R</span>
<span class="num">\{\{buy_number\}\}</span>
</h3>
<a href="javascript:void(0)" class="delete" onclick="delCartGoods(%L=v.goods_incart_id%R,%L=v.is_cheapest_free%R);">删除</a>
<a href="javascript:void(0)" class="delete goodscardelete" goodsid=\{\{goods_incart_id\}\} cheapest=\{\{is_cheapest_free\}\}>删除</a>
</div>
</li>
%L~%R
%L~it.cartData.gift_goods :v:index%R
\{\{/outlet_goods\}\}
\{\{#gift_goods\}\}
<li class="goods-item">
<a href="%L=v.product_url%R">
<img src="%L=v.default_img%R" alt="" class="goods-img"></a>
<a href="\{\{product_url\}\}">
<img src="\{\{default_img\}\}" alt="" class="goods-img"></a>
<div class="goods-detail float-left">
<h3 class="content"><a href="%L=v.product_url%R">%L=v.product_name%R</a></h3>
<h3 class="content"><a href="\{\{product_url\}\}">\{\{product_name\}\}</a></h3>
<h3 class="style">
颜色:
<span class="color">%L=v.color_name%R</span>
<span class="color">\{\{color_name\}\}</span>
尺码:
<span class="size">%L=v.size_name%R</span>
<span class="size">\{\{size_name\}\}</span>
</h3>
</div>
<div class="goods-price float-left">
<h3 class="priceandnum">
<span class="price">%L=v.show_price%R</span>
<span class="price">\{\{show_price\}\}</span>
x
<span class="num">%L=v.buy_number%R</span>
<span class="num">\{\{buy_number\}\}</span>
</h3>
<a href="javascript:void(0)" class="delete" onclick="delCartGoods(%L=v.goods_incart_id%R,%L=v.is_cheapest_free%R);">删除</a>
<a href="javascript:void(0)" class="delete goodscardelete" goodsid=\{\{goods_incart_id\}\} cheapest=\{\{is_cheapest_free\}\}>删除</a>
</div>
</li>
%L~%R
%L~it.cartData.need_pay_gifts :v:index%R
\{\{/gift_goods\}\}
\{\{#need_pay_gifts\}\}
<li class="goods-item">
<a href="%L=v.product_url%R">
<img src="%L=v.default_img%R" alt="" class="goods-img"></a>
<a href="\{\{product_url\}\}">
<img src="\{\{default_img\}\}" alt="" class="goods-img"></a>
<div class="goods-detail float-left">
<h3 class="content"><a href="%L=v.product_url%R">%L=v.product_name%R</a></h3>
<h3 class="content"><a href="\{\{product_url\}\}">\{\{product_name\}\}</a></h3>
<h3 class="style">
颜色:
<span class="color">%L=v.color_name%R</span>
<span class="color">\{\{color_name\}\}</span>
尺码:
<span class="size">%L=v.size_name%R</span>
<span class="size">\{\{size_name\}\}</span>
</h3>
</div>
<div class="goods-price float-left">
<h3 class="priceandnum">
<span class="price">%L=v.show_price%R</span>
<span class="price">\{\{show_price\}\}</span>
x
<span class="num">%L=v.buy_number%R</span>
<span class="num">\{\{buy_number\}\}</span>
</h3>
<a href="javascript:void(0)" class="delete" onclick="delCartGoods(%L=v.goods_incart_id%R,%L=v.is_cheapest_free%R);">删除</a>
<a href="javascript:void(0)" class="delete goodscardelete" goodsid=\{\{goods_incart_id\}\} cheapest=\{\{is_cheapest_free\}\}>删除</a>
</div>
</li>
%L~%R
\{\{/need_pay_gifts\}\}
</ul>
<ul class="activity-list">
%L? it.cartData.has_promotion == 1%R
{{#equalone has_promotion\}\}
<li class="activity-item">
<span class="activity-name">活动</span>
<h3 class="activity-content">
%L? it.cartData.fit_outlet_promotion %R购outlet商品,满¥1999再享9折%L?%R
%L? it.cartData.has_other_promotion == 1 %R<span class="mycart_i_down" title="更多" onclick="dispDom(this, 'mycartmore');"></span>%L?%R
%L? it.cartData.has_first_promotion == 1 %R%L=it.cartData.first_promotions.promotion_title%R%L?%R
\{\{fit_outlet_promotion \}\}购outlet商品,满¥1999再享9折\}\}
\{\{#equalone has_other_promotion\}\}
<span class="mycart_i_down" title="更多" ></span>
\{\{/equalone\}\}
\{\{#equalone has_first_promotion\}\}
\{\{first_promotions.promotion_title\}\}
\{\{/equalone\}\}
</h3>
</li>
%L?%R
%L? it.cartData.fit_free_shipping == 1%R
\{\{/equalone\}\}
\{\{#equalone fit_free_shipping \}\}
<li class="activity-item">
<span class="activity-name">免运费</span>
<h3 class="activity-content">全场满 499免运费</h3>
</li>
%L?%R
\{\{/equalone\}\}
</ul>
</div>
<div class="gobuy-notempty-footer">
<h3>
<a href="<?php print QConfigs_Site_Config::$site_url;?>/shopping/cart">去购物车结算</a>
</h3>
</div>
</div>
</script>
<script type="text/html" id="tmpl-my-login-new">
<div class="myyoho-info-header clearfix">
%L? it.head_ico %R
<div class="myyoho-photo" style="display:none;"><img src="" alt="" data-url ="%L=it.head_ico%R"></div>
%L?%R
<h3 class="user-email"><a href="<?php print QConfigs_Site_Config::$site_url?>/home?t=%L=it.random%R">%L=it.profile_name%R</a></h3>
<h3 class="user-level">
VIP:
<span class="leveldetail">%L=it.vip.curVipInfo.title%R</span>
</h3>
%L? it.vip.curVipInfo.curLevel < 3%R
<div class="levelinfo">
<div class="levelwrapper float-left">
<div class="levelspan">
<span class="has">%L=it.vip.curYearCost%R</span>
/
<span class="total">%L=it.vip.nextVipInfo.needCost%R</span>
</div>
<p class="%L? it.vip.curYearCostPer !=0%Rintegrate%L?%R" style="width: %L=it.vip.curYearCostPer%R%;"></p>
</div>
<span class="cardcate float-left">%L=it.vip.nextVipInfo.title%R</span>
</div>
%L?%R
</div>
<ul class="myyoho-info-content">
<li class="item">
<span class="itemdetail float-left">
<a href="<?php print QConfigs_Site_Config::$site_url?>/home/orders?t=<?php print microtime(true);?>">待处理的订单</a>
</span>
<span class="itemnum float-right">%L=it.orderCount%R</span>
</li>
<li class="item">
<span class="itemdetail float-left">
<a href="<?php print QConfigs_Site_Config::$site_url?>/home/favorite?t=<?php print microtime(true);?>">我的收藏</a>
</span>
<span class="itemnum float-right"></span>
</li>
<li class="item">
<span class="itemdetail float-left">
<a href="<?php print QConfigs_Site_Config::$site_url?>/home/coupons?t=<?php print microtime(true);?>">我的优惠券</a>
</span>
<span class="itemnum float-right">%L=it.couponCount%R</span>
</li>
<li class="item">
<span class="itemdetail float-left">
<a href="<?php print QConfigs_Site_Config::$site_url?>/home/currency?t=<?php print microtime(true);?>">我的YOHO币</a>
</span>
<span class="itemnum float-right">%L=it.YohocoinCount%R</span>
</li>
<li class="item">
<span class="itemdetail float-left">
<a href="<?php print QConfigs_Site_Config::$site_url?>/home/returns?t=<?php print microtime(true);?>">我的退货换货</a>
</span>
<span class="itemnum float-right">%L=it.refundCount%R</span>
</li>
</ul>
<div class="myyoho-info-footer">
<a href="<?php print QConfigs_Site_Config::$site_url?>/home/user?t=<?php print microtime(true);?>">完善资料</a>
</div>
</script>
<script type="text/html" id="tmpl-nologin">
<span>Hi~</span>[<a href="<?php print QConfigs_Site_Config::$site_url;?>/signin.html" class="list-a login-out">请登录</a>]&nbsp;[<a href="<?php print QConfigs_Site_Config::$site_url;?>/reg.html" class="list-a login-out" onclick="getSource('会员部_注册统计','免费注册','homepage_man');">免费注册</a>]
</script>
<script type="text/html" id="tmpl-login">
<span>Hi~<a href="<?php print QConfigs_Site_Config::$site_url;?>/home?t=<?php print microtime(true);?>">%L=it.user_name%R</a></span>&nbsp;%L? it.is_login == 1%R[<a href="%L=it.logout%R" class="list-a login-out">退出</a>]%L??%R[<a href="<?php print QConfigs_Site_Config::$site_url;?>/signin.html" class="list-a login-out">请登录</a>]&nbsp;[<a href="<?php print QConfigs_Site_Config::$site_url;?>/reg.html" onclick="getSource('会员部_注册统计','免费注册','homepage_man');" class="list-a login-out">免费注册</a>]%L?%R
</script>
<script type="text/html" id="tmpl-my-noLogin">
<div class="account-login">
<div><a href="<?php print QConfigs_Site_Config::$site_url?>/signin.html" class="button">立即登录</a></div>
<div><span>新用户?</span><a href="<?php print QConfigs_Site_Config::$site_url?>/reg.html" onclick="getSource('会员部_注册统计','免费注册','homepage_man');">[免费注册]</a></div>
</div>
<ul class="home-layer">
<li class="clear"><a href="<?php print QConfigs_Site_Config::$site_url?>/home/orders?t=<?php print microtime(true);?>" class="left">我的订单</a></li>
<li class="clear"><a href="<?php print QConfigs_Site_Config::$site_url?>/home/favorite?t=<?php print microtime(true);?>" class="left">我的收藏</a></li>
<li class="clear"><a href="<?php print QConfigs_Site_Config::$site_url?>/home/coupons?t=<?php print microtime(true);?>" class="left">我的优惠券</a></li>
<li class="clear"><a href="<?php print QConfigs_Site_Config::$site_url?>/home/currency?t=<?php print microtime(true);?>" class="left">我的YOHO币</a></li>
<li class="clear"><a href="<?php print QConfigs_Site_Config::$site_url?>/home/returns?t=<?php print microtime(true);?>" class="left">我的退换货</a></li>
</ul>
</script>
<script type="text/html" id="tmpl-message">
<ul>%L~ it :v:index%R<li><a href="<?php print QConfigs_Site_Config::$site_url;?>/home/message/content?id=%L=v.id%R">%L=v.title%R</a></li>%L~%R</ul>
</script>
</div>
{{/headerdata}}
\ No newline at end of file
\{\{/carData\}\}
</script>
</div>
\ No newline at end of file
... ...
<script>
seajs.use('js/common');
seajs.use('js/header',function(header) {
if(header) {
header.init();
}
});
</script>
{{!-- 首页 --}}
{{#if boysHomePage}}
<script>
/*seajs.use('js/home/entrey', function(h) {
h.set('boys');
});*/
seajs.use('js/home/home');
</script>
{{/if}}
... ... @@ -20,6 +11,17 @@
{{!-- 搜索 --}}
{{#if searchListPage}}
<script>
seajs.use('js/product/list');
seajs.use(['js/product/list', 'js/product/product'], function (list, product) {
product.init(5);
});
</script>
{{/if}}
{{!-- 列表 --}}
{{#if productListPage}}
<script>
seajs.use(['js/product/list', 'js/product/product'], function (list, product) {
product.init(4);
});
</script>
{{/if}}
\ No newline at end of file
... ...
<div class="filter-box">
{{# checkedConditions}}
<div class="checked-conditions section">
<span class="title">已选条件:</span>
<div class="attr-content clearfix">
{{#each conditions}}
<a class="tag" href="{{href}}">
{{#if name}}
{{name}}
{{^}}
<i class="color-block" style="background: {{color}}"></i>
{{/if}}
<i class="close iconfont">&#xe602;</i>
</a>
{{/each}}
<a class="clear-checked" href="{{clearUrl}}">清空筛选条件</a>
</div>
</div>
{{/ checkedConditions}}
{{#if channel}}
<div class="channel section">
<span class="title">频道:</span>
<div class="attr-content clearfix">
{{#each channel}}
<a class="attr" href="{{href}}">
{{name}}
</a>
{{/each}}
</div>
</div>
{{/if}}
{{#if sort}}
<div class="sort section">
<span class="title">分类:</span>
<div class="attr-content">
<ul class="sort-pre clearfix">
{{#each sort}}
<li>
<span class="attr">
{{name}}
</span>
</li>
{{/each}}
</ul>
<div class="sort-sub-wrap">
{{#each sort}}
<ul class="sort-sub clearfix hide">
{{#each sub}}
<li class="attr">
<a href="{{href}}">{{name}}</a>
</li>
{{/each}}
</ul>
{{/each}}
</div>
</div>
</div>
{{/if}}
{{# brand}}
<div class="brand section">
<span class="title">品牌:</span>
<div class="attr-content">
<ul class="default clearfix">
{{# default}}
<li class="attr">
<a href="{{href}}" title="{{name}}">{{name}}</a>
</li>
{{/ default}}
</ul>
<div class="brand-opt">
<span id="brand-more" class="brand-more">
<em>更多</em>
<i class="iconfont">&#xe600;</i>
</span>
<span id="brand-multi" class="multi-select">多选 +</span>
</div>
<div class="brand-panel hide">
<div class="panel-head clearfix">
<p class="brands-index">
{{#each brandIndex}}
<span data-index="{{index}}">{{name}}</span>
{{/each}}
</p>
<div class="brand-search">
<input id="brand-search-input" type="text">
<span class="btn">
<i class="iconfont">&#xe611;</i>
</span>
</div>
</div>
<ul class="panel-body check-container clearfix">
{{# brandsShow}}
<li class="attr" data-index="{{index}}" data-key="{{key}}">
<a href="{{href}}">
<span class="iconfont checkbox" data-id="{{id}}">&#xe613;</span>
<span title="{{name}}">{{name}}</span>
</a>
</li>
{{/ brandsShow}}
</ul>
<div class="btns">
<button id="brand-multi-ok" class="multi-select-ok dis">确定</button>
<button class="multi-select-cancel">取消</button>
</div>
</div>
</div>
</div>
{{/ brand}}
{{#if price}}
<div class="price section">
<span class="title">价格:</span>
<div class="attr-content clearfix">
{{# price}}
<a class="attr" href="{{href}}">¥{{name}}</a>
{{/ price}}
<div class="ud-price-range">
¥
<input type="text" class="min limit">
<span class="price-sep">-</span>
<input type="text" class="max limit">
<button class="price-sure hide">确定</button>
</div>
</div>
</div>
{{/if}}
{{#if color}}
<div class="color section">
<span class="title">颜色:</span>
<div class="attr-content clearfix">
{{# color}}
<a class="attr" href="{{href}}">
<i class="color-block" style="background: {{rgb}}"></i>
{{name}}
</a>
{{/ color}}
</div>
</div>
{{/if}}
{{#if size}}
<div class="size section">
<span class="title">尺码:</span>
<div class="attr-content clearfix">
{{# size}}
<a class="attr" href="{{href}}">{{name}}</a>
{{/ size}}
</div>
</div>
{{/if}}
{{#if seniorChose}}
<div class="senior section">
<span class="title">高级选项:</span>
<div class="attr-content">
<ul class="clearfix senior-attr-wrap">
{{#each seniorChose}}
<li class="attr">
{{name}}
<span class="iconfont">&#xe600;</span>
<div class="senior-up-icon"></div>
</li>
{{/each}}
</ul>
<div class="senior-sub-wrap">
{{#each seniorChose}}
<div class="senior-sub hide" data-attr="{{attr}}">
{{#if showMulti}}
<span class="multi-select">多选 +</span>
{{/if}}
<ul class="clearfix check-container">
{{#each sub}}
<li class="attr">
<a href="{{href}}">
<span class="iconfont checkbox" data-id="{{id}}">&#xe613;</span>
<span>{{name}}</span>
</a>
</li>
{{/each}}
</ul>
<div class="btns">
<button class="multi-select-ok dis">确定</button>
<button class="multi-select-cancel">取消</button>
</div>
</div>
{{/each}}
</div>
</div>
</div>
{{/if}}
</div>
\ No newline at end of file
... ...
<div class="sort-pager">
{{# sortType}}
<a class="sort-type{{#if active}} active{{/if}}" href="{{href}}">
{{name}}
{{#if hasSortOrient}}
{{#if active}}
{{#if desc}}
<span class="active-icon iconfont">&#xe603;</span>
{{^}}
<span class="active-icon iconfont">&#xe604;</span>
{{/if}}
{{^}}
<span class="iconfont">&#xe614;</span>
{{/if}}
{{^}}
<span class="iconfont">&#xe604;</span>
{{/if}}
</a>
{{/ sortType}}
{{# checks}}
<a class="checks{{#if checked}} checked{{/if}}" href="{{href}}">
{{#if checked}}
<span class="iconfont">&#xe612;</span>
{{^}}
<span class="iconfont">&#xe613;</span>
{{/if}}
{{name}}
</a>
{{/ checks}}
<div class="pager-wrap">
<div class="page-count">
<span id="count-per-page">
{{countPerPage}}
<i class="iconfont">&#xe604;</i>
</span>
每页
<ul>
{{# pageCounts}}
<li>
<a href="{{href}}">{{count}}</a>
</li>
{{/ pageCounts}}
</ul>
</div>
<p class="pager">
{{#if preHref}}
<a href="{{preHref}}">
<span class="iconfont">&#xe615;</span>
</a>
{{^}}
<span class="dis-icon iconfont">&#xe615;</span>
{{/if}}
<span>
<i>{{curPage}}</i>/{{pageCount}}
</span>
{{#if nextHref}}
<a href="{{nextHref}}">
<span class="iconfont">&#xe601;</span>
</a>
{{^}}
<span class="dis-icon iconfont">&#xe601;</span>
{{/if}}
</p>
</div>
</div>
\ No newline at end of file
... ...
... ... @@ -14,7 +14,7 @@ fonts_dir = "font"
output_style = :expanded
# To enable relative paths to assets via compass helper functions. Uncomment:
relative_assets = true
# sourcemap = true
sourcemap = true
# To disable debugging comments that display the original location of your selectors. Uncomment:
line_comments = false
... ...
No preview for this file type
No preview for this file type
No preview for this file type
No preview for this file type
... ... @@ -2,7 +2,7 @@
<!DOCTYPE svg PUBLIC "-//W3C//DTD SVG 1.1//EN" "http://www.w3.org/Graphics/SVG/1.1/DTD/svg11.dtd" >
<svg xmlns="http://www.w3.org/2000/svg">
<metadata>
Created by FontForge 20120731 at Wed Dec 2 17:34:20 2015
Created by FontForge 20120731 at Thu Dec 10 11:10:57 2015
By Ads
</metadata>
<defs>
... ... @@ -19,7 +19,7 @@ Created by FontForge 20120731 at Wed Dec 2 17:34:20 2015
bbox="0 -214 1172.1 864"
underline-thickness="50"
underline-position="-100"
unicode-range="U+0078-E616"
unicode-range="U+0078-E61B"
/>
<missing-glyph horiz-adv-x="374"
d="M34 0v682h272v-682h-272zM68 34h204v614h-204v-614z" />
... ... @@ -84,5 +84,18 @@ d="M704 569l-41 39l-343 -320l343 -320l41 39l-301 281z" />
<glyph glyph-name="uniE616" unicode="&#xe616;" horiz-adv-x="1173"
d="M586 588q-64 150 -188 203q-114 47 -222 -7q-112 -56 -155 -192q-20 -67 -21 -144q0 -41 9 -78.5t24 -66.5t39 -57.5t47 -48.5t55.5 -43t56.5 -38t58.5 -35.5t53.5 -33.5q63 -42 118 -94.5t86.5 -95t39.5 -69.5q4 19 25.5 50t53.5 66t75 74t88 71q21 15 53.5 35.5t58 36
t57 38t55 43t47 48t39 56.5t25 66.5t8.5 78.5q0 75 -19.5 138t-52.5 105.5t-76.5 70.5t-91 37.5t-98 1t-96 -34.5t-85.5 -72.5t-67 -108.5z" />
<glyph glyph-name="uniE617" unicode="&#xe617;"
d="M500 775l-348 -298q-16 -14 -16 -35v-386q0 -16 8 -30t22 -22t30 -8h197v257h238v-257h197q25 0 42.5 17.5t17.5 42.5v386q0 10 -4.5 19t-11.5 16l-348 298q-3 2 -6 3.5t-6 1.5t-6 -1.5t-6 -3.5z" />
<glyph glyph-name="uniE618" unicode="&#xe618;" horiz-adv-x="1000"
d="M751 670q21 -20 34 -33t20 -23q3 -4 5 -8t3 -7t1.5 -6t0.5 -5v-13h-119q-4 0 -7.5 1.5t-6.5 4.5q-6 6 -10 14t-6 16.5t-2 12.5v100h3q3 0 6.5 -0.5t6.5 -1.5q7 -2 16 -8q4 -3 9.5 -7t12.5 -9q13 -10 33 -28zM614 624q0 -16 5 -33.5t15 -32t26 -24t38 -9.5h117v-451
q0 -24 -9.5 -42t-24.5 -31t-33.5 -20t-35.5 -7h-394q-15 0 -33 8.5t-33.5 23t-26.5 32.5q-2 5 -4 9.5t-3.5 9.5t-2 10t-0.5 10v543q0 9 2 17.5t6 17.5q7 18 20.5 33.5t30 25.5t35.5 10h305v-100zM664 125q21 0 35.5 14.5t14.5 35.5t-14.5 35.5t-35.5 14.5h-299
q-21 0 -35.5 -14.5t-14.5 -35.5t14.5 -35.5t35.5 -14.5h299zM714 374q0 21 -14.5 36t-35.5 15h-299q-21 0 -35.5 -15t-14.5 -36t14.5 -35t35.5 -14h299q21 0 35.5 14t14.5 35zM714 374z" />
<glyph glyph-name="uniE619" unicode="&#xe619;"
d="M512 515q47 0 88 -18t72 -49t49 -72t18 -89q0 -23 -4.5 -45t-13.5 -42q-18 -41 -49 -72t-72 -49q-20 -9 -42 -13.5t-46 -4.5q-47 0 -88 18t-72 49t-49 72t-18 87q0 48 18 89t49 72t72 49t88 18v0zM512 515z" />
<glyph glyph-name="uniE61A" unicode="&#xe61a;"
d="M903 493l-68 69l-388 -388l-231 230l-68 -68l299 -298l65 65z" />
<glyph glyph-name="uniE61B" unicode="&#xe61b;"
d="M505 253l2 -2q2 -1 4 -1l3 1l430 364q2 2 1 6l-2 2q-1 1 -3 1h-435h-424q-2 0 -3 -1l-2 -2l1 -6zM72 585q-3 2 -6 0l-3 -4v-584q0 -4 3.5 -5t5.5 1l288 346zM953 585h-5l-288 -246l287 -346q3 -2 6 -1t3 5v584q0 3 -3 4zM641 322l-131 -111l-5 5l-125 103l-275 -328
q-2 -3 -1 -6l2 -2q1 -1 3 -1h396h407q4 0 5 3t-1 6z" />
</font>
</defs></svg>
... ...
... ... @@ -4,5 +4,6 @@ require('./js/common');
require('./js/home/home');
require('./js/product/list');
require('./js/product/product');
module.exports = webYohobuy;
... ...
... ... @@ -5,6 +5,9 @@
*/
var $ = require('yoho.jquery');
require('./footer');
require('./header');
function cookie(name) {
var cookies = document.cookie,
cookieVal,
... ...
/**
*Description: 商品自定义事件
*Author: chenglong.wang@yoho.cn
*Date: 2015/12/3
*/
var $ = require('yoho.jquery');
function ProductEvent() {
this.handlers = {};
}
ProductEvent.prototype = {
constructor: ProductEvent,
addHandler: function(type, handler) {
if (typeof this.handlers[type] === 'undefined') {
this.handlers[type] = [];
}
this.handlers[type].push(handler);
},
fire: function(event) {
var handlers,
i;
if (!event.target) {
event.target = this;
}
if (this.handlers[event.type] instanceof Array) {
handlers = this.handlers[event.type];
for (i = 0; i < handlers.length; i++) {
handlers[i](event);
}
}
},
removeHandler: function(type, handler) {
var handlers,
i;
if (this.handlers[type] instanceof Array) {
handlers = this.handlers[type];
for (i = 0; i < handlers.length; i++) {
if (handlers[i] === handler) {
break;
}
}
handlers.splice(i, 1);
}
}
};
module.exports = function($o, rowWidth) {
var pMouseHover = new ProductEvent();
var targetWidth = $o.eq(0).width(),
targetHeight = $o.eq(0).height(),
winW = $(window).width();
function handleEvent(event) {
var $target,
targetX = 0,
targetY = 0,
rowW = rowWidth,
activeIndex = 0,
$targetDuplicate = '',
offsetL = 0,
offsetR = 0;
switch (event.type) {
case 'mouseenter':
$target = $(this);
$targetDuplicate = $target.clone();
activeIndex = $target.index() + 1;
targetX = (activeIndex % rowW) === 0 ? rowW : activeIndex % rowW;
targetY = Math.ceil(activeIndex / rowW);
offsetL = $target.offset().left;
offsetR = winW - (offsetL + targetWidth);
pMouseHover.fire({
type: 'MouseEnter',
target: $target,
targetWidth: targetWidth,
targetHeight: targetHeight,
targetX: targetX,
targetY: targetY,
rowWidth: rowW,
activeIndex: activeIndex,
targetDuplicate: $targetDuplicate,
offsetL: offsetL,
offsetR: offsetR
});
break;
case 'mouseleave':
pMouseHover.fire({
type: 'MouseLeave'
});
break;
}
}
$o.bind('mouseenter', handleEvent);
//$o.bind('mouseleave', handleEvent);
return pMouseHover;
};
\ No newline at end of file
... ...
/**
* 尾部
* @author: wangqing<robin.wang@yoho.cn>
* @date: 2015/12/01
*/
var $ = require('yoho.jquery');
var apiDomain;
/**
* 订阅
* @return {[type]} [description]
*/
function actionSubscription() {
var $subscriberBox = $('#subscriber-box'),
$subscriberBtn = $('#subscriber-btn'),
emailReg = /^[.\-_a-zA-Z0-9]+@[\-_a-zA-Z0-9]+\.[a-zA-Z0-9]/;
var subscribeParam = {
method: 'open.subscriber.subscriber',
v: 1,
return_type: 'jsonp',
open_key: '12345'
};
var iconCode = {
mail: '&#xe61b;',
tick: '&#xe61a'
};
var email = $.trim($subscriberBox.val());
var params = {};
$subscriberBox.focus(function() {
$(this).val('').css('color', '');
$subscriberBtn.removeClass('done').html(iconCode.mail);
});
$subscriberBtn.click(function() {
if (email !== '' && emailReg.test(email)) {
$.extend(params, subscribeParam, {
email: email,
tmp: Math.random(),
uid: $.uid('_UID')
});
try {
$.getJSON('http://test.open.yohobuy.com' + '/?callback=?', params, function(data) {
if (data.data.result === 1) {
$subscriberBox.val('已订阅到:' + email);
$subscriberBtn.addClass('done').html(iconCode.tick);
} else {
$subscriberBox.css('color', 'red');
}
});
} catch (e) {
console.log(e.message);
}
} else {
$subscriberBox.css('color', 'red');
}
});
}
function actionhomeFootChange() {
var $vote = $('.vote'),
$feedBackPage = $('#feed-back-page'),
count = $vote.children('li').length;
//意见反馈
$feedBackPage.on('click', 'span', function() {
var $this = $(this);
if ($this.hasClass('cur')) {
return;
}
$this.siblings('.cur').removeClass('cur');
$this.addClass('cur');
$vote.children().not('.hide').addClass('hide')
.end()
.eq($this.index()).removeClass('hide');
});
$vote.on('click', '.feed-back-btn', function() {
var $this = $(this),
$li = $this.closest('li'),
index = $li.index(),
params = {},
_solution = [];
var _answer = $li.find('.feedback-answer').val(),
_feedback = $li.find('.feedback-id').val(),
_question = $li.find('.question-id').val();
$li.find(':checked').each(function() {
_solution.push($(this).val());
});
params = {
method: 'open.feedback.submit',
feedback: _feedback || 0,
question: _question || 0,
answer: _answer || '',
solution: _solution.join(',')
};
$.getData(apiDomain, params, function(data) {
var next = index + 1;
if (data.result === 1) {
if (index === count - 1) {
alert('感谢您的参与!');
return;
}
$li.addClass('hide');
$vote.eq(index + 1).removeClass('hide');
$feedBackPage.children('.cur').removeClass('cur');
$feedBackPage.eq(next).addClass('cur');
}
});
});
}
//初始化
actionSubscription();
actionhomeFootChange();
... ...
... ... @@ -6,9 +6,24 @@
var $ = require('yoho.jquery');
var yohodoT = require('../plugin/yohodoT');
var handlebars = require('yoho.handlebars');
var json2 = require('json2');
var noticeSuccess = false;
/**
* 判断为1的helper
* @param {[type]} v1 [description]
* @param {[type]} options) { if (v1 [description]
* @return {[type]} [description]
*/
handlebars.registerHelper('equalone', function(v1, options) {
if (v1 === '1') {
return options.fn(this);
} else {
return options.inverse(this);
}
});
require('../plugin/yohocookie');
require('../plugin/yohocart');
/**
... ... @@ -549,10 +564,10 @@ function loadCartData() {
shopping_key: $.getShoppingKey()
}, function(jsonData) {
if (window.cartTpl === '') {
window.cartTpl = yohodoT.template($('#mini-cart-tpl').html());
window.cartTpl = handlebars.compile($('#mini-cart-tpl').html());
}
$('#miniCartBox').children('.gobuy-wrapper').html(window.cartTpl({
cartData: jsonData
carData: jsonData
}));
if (parseInt($('.ic-infomation').html()) === 0) {
$('#miniCartBox .gobuy-wrapper').html('<div class="gobuy-empty">' +
... ... @@ -560,7 +575,7 @@ function loadCartData() {
}
if ($('#miniCartBox .goods-list li').length < 1) {
shoppingInfo = $.cookie('_g');
shoppingData = eval('(' + shoppingInfo + ')');
shoppingData = json2.parse(shoppingInfo);
if (shoppingData !== null) {
strK = '{"_k":"' + shoppingData._k + '","_nac":0' + ',"_ac":0,"_r":0}';
$.setcookie('_g', strK, {
... ... @@ -588,7 +603,7 @@ function delCartGoods(id, isreduce) {
isreduce: isreduce
}, function(jsonData) {
var shoppingInfo = $.cookie('_g');
var shoppingData = eval('(' + shoppingInfo + ')');
var shoppingData = json2.parse(shoppingInfo);
var strK = '{"_k":"' + shoppingData._k + '","_nac":' + jsonData.total_goods_num + ',"_ac":0,"_r":0}';
$.setcookie('_g', strK, {
... ... @@ -602,12 +617,40 @@ function delCartGoods(id, isreduce) {
window.apiDomain = 'http://api.open.yohobuy.com';
window.cartTpl = '';
/**
* 监听购物车删除
* @return {[type]} [description]
*/
function actionListenDelCarGoods() {
var $delcargoods;
var goodsid,
cheapest;
$(document).on('click', '.goodscardelete', function(e) {
$delcargoods = $(this);
goodsid = $delcargoods.attr('goodsid');
cheapest = $delcargoods.attr('cheapest');
delCartGoods(goodsid, cheapest);
});
}
/**
* 监听点击更多打折商品
* @return {[type]} [description]
*/
function actionListenCartMore() {
var $morecart;
$(document).on('click', '.mycart_i_down', function(e) {
$morecart = $(this);
$morecart.toggleClass('mycart_i_up');
$('#mycartmore').slideToggle(300);
});
}
/**
* 点击购物车
* @return {[type]} [description]
*/
function clickMiniCartBox() {
function actionClickMiniCartBox() {
var $target;
var shopcarurl = 'http://www.yohobuy.com/shopping/cart';
... ... @@ -771,7 +814,7 @@ function actionLoopUpdCartNum() {
* @return {[type]} [description]
*/
function actionExeTemplate() {
var resulthtml = $('#goodcartempwarpper').html().replace(/\%L/g, '{{').replace(/\%R/g, '}}');
var resulthtml = $('#goodcartempwarpper').html().replace(/\\/g, '');
$('#goodcartempwarpper').html(resulthtml);
}
... ... @@ -788,7 +831,7 @@ function actionSearch() {
* 初始化函数
* @return {[type]} [description]
*/
exports.init = function() {
function init() {
actionExeTemplate(); //处理模板
actionInitCookie(); //初始化cookie
actionExeCookieMap(); //格式化cookie
... ... @@ -803,6 +846,9 @@ exports.init = function() {
actionUpdateCartNum(); //更新购物车数量
actionLoopUpdCartNum(); //循环检测购物车数量
actionSearch(); //搜索执行
actionClickMiniCartBox(); //点击购物车跳转
actionListenDelCarGoods(); //监听购物车删除
actionListenCartMore(); //
}
};
\ No newline at end of file
init();
\ No newline at end of file
... ...
/**
* 商品筛选逻辑
* @author: xuqi<qi.xu@yoho.cn>
* @date: 2015/12/4
*/
var $ = require('yoho.jquery');
var checkUnicode = {
unchecked: '&#xe613;',
checked: '&#xe612;'
},
moreUnicode = {
up: '&#xe610;',
down: '&#xe600;'
};
//品牌相关变量
var $brandDefault = $('.brand .default'),
$brandPanel = $('.brand .brand-panel'),
$brandAttrs = $('.brand .attr'),
$brandMore = $('#brand-more'),
$brandMulti = $('#brand-multi');
var $brandMoreTxt, $brandMoreIcon;
//价格相关变量
var $udPrice = $('.ud-price-range'),
interReg = /^\d+$/,
$limit, $min, $max, $btn;
//分类相关变量
var $sortSub = $('.sort-sub-wrap');
//高级选项相关变量
var $seniorSubWrap = $('.senior-sub-wrap'),
$seniorAttrWrap = $('.senior-attr-wrap');
var seniorHoverTime, hoveredIndex;
//清除checkbox选中状态
function clearChecked($checkbox) {
$checkbox.removeClass('checked').html(checkUnicode.unchecked);
}
//显示更多品牌面板
function brandShowMore() {
$brandDefault.addClass('hide');
$brandPanel.removeClass('hide');
}
//隐藏更多品牌面板
function brandHideMore() {
$brandPanel.addClass('hide');
$brandDefault.removeClass('hide');
}
//url构造&跳转
function uriLoc(attr, val) {
var href = decodeURIComponent(window.location.search),
query = attr + '=' + val,
newHref;
if (href === '') {
newHref = '?' + query;
} else {
newHref = href + '&' + query;
}
window.location.href = newHref;
}
//隐藏高级选项面板
function hideSeniorPanel(index) {
$seniorSubWrap.children('.senior-sub:eq(' + hoveredIndex + ')').addClass('hide');
$seniorAttrWrap.children('.attr:eq(' + hoveredIndex + ')').removeClass('hover');
hoveredIndex = -1;
}
//屏蔽筛选项双击文字选中
$('.filter-box').on('selectstart', '.attr, .brands-index span', function() {
return false;
});
//【分类】
$('.sort-pre').on('click', 'li', function() {
var $this = $(this),
index = $this.index();
$this.siblings('.active').removeClass('active');
$this.addClass('active');
$sortSub.children(':not(.hide)').addClass('hide');
$sortSub.children(':eq(' + index + ')').removeClass('hide');
});
//【品牌】
if ($brandMore.length > 0) {
$brandMoreTxt = $brandMore.children('em');
$brandMoreIcon = $brandMore.children('.iconfont');
}
//【品牌】多选
$brandMulti.click(function() {
if ($brandPanel.css('display') === 'none') {
//显示品牌面板
brandShowMore();
}
$brandPanel.addClass('multi'); //显示出checkbox
$(this).addClass('hide');
});
//【品牌】更多
$brandMore.click(function() {
var $this = $(this);
if ($this.hasClass('more')) {
brandHideMore();
$brandMoreTxt.text('更多');
$brandMoreIcon.html(moreUnicode.down);
} else {
brandShowMore();
$brandMoreTxt.text('收起');
$brandMoreIcon.html(moreUnicode.up);
}
$(this).toggleClass('more');
});
//【品牌】索引
$('.brands-index').on('click', 'span', function() {
var $this = $(this),
index = $this.data('index');
if ($this.index() === 0) {
//全部
$brandAttrs.removeClass('hide');
} else {
$brandAttrs.addClass('hide').filter('[data-index=' + index + ']').removeClass('hide');
}
});
//【品牌】搜索
$('#brand-search-input').keyup(function() {
var val = $(this).val().toLowerCase();
if (val === '') {
$brandAttrs.removeClass('hide');
} else {
$brandAttrs.addClass('hide').filter('[data-key*=' + val + ']').removeClass('hide');
}
});
//【品牌】多选确定
$('#brand-multi-ok').click(function() {
var val = '';
if ($(this).hasClass('dis')) {
return;
}
$brandPanel.find('.checked').each(function() {
var id = $(this).data('id');
val += (val === '') ? id : (',' + id);
});
uriLoc('brand', val);
});
//【品牌/高级选项】多选取消
$('.multi-select-cancel').click(function() {
var $panel = $(this).closest('.multi');
if ($panel.hasClass('brand-panel')) {
brandHideMore();
$brandMulti.removeClass('hide'); //显示多选按钮
}
$panel.removeClass('multi');
clearChecked($panel.find('.checkbox.checked')); //清除选中状态
});
//【品牌/高级选项】checkbox
$('.check-container').on('click', '.attr', function() {
var $this = $(this),
$check = $this.find('.checkbox'),
$btnOk = $this.parent('.check-container').next('.btns').find('.multi-select-ok');
$check.toggleClass('checked');
if ($check.hasClass('checked')) {
$check.html(checkUnicode.checked);
} else {
$check.html(checkUnicode.unchecked);
}
//更新按钮状态
if ($check.hasClass('checked') ||
$this.siblings('.attr').find('.checked').length > 0) {
$btnOk.removeClass('dis');
} else {
$btnOk.addClass('dis');
}
});
//【品牌/高级选项】当多选时阻止链接默认跳转
$('.brand, .senior').on('click', '.attr > a', function(e) {
if ($(this).closest('.multi').length > 0) {
e.preventDefault();
}
});
//【价格】用户定义价格处理
if ($udPrice.length > 0) {
$limit = $udPrice.find('.limit');
$min = $limit.filter('.min');
$max = $limit.filter('.max');
$btn = $udPrice.find('.price-sure');
//【价格】输入
$limit.keyup(function() {
var min = $.trim($min.val()),
max = $.trim($max.val()),
isMinInt = interReg.test(min),
isMaxInt = interReg.test(max);
if (isMaxInt && (min === '' || isMinInt) ||
isMinInt && (max === '' || isMaxInt)
) {
$btn.removeClass('hide');
} else {
$btn.addClass('hide');
}
});
//【价格】多项查询
$btn.click(function() {
var min = $.trim($min.val()),
max = $.trim($max.val()),
tmp;
//对于min大于max的情况,交换位置
if (min !== '' && max !== '' && +min > +max) {
tmp = max;
max = min;
min = tmp;
}
uriLoc('price', min + ',' + max);
});
}
//【高级选项】鼠标移入显示子项
$seniorAttrWrap.on('mouseenter', '.attr', function() {
var index = $(this).addClass('hover').index();
$seniorSubWrap.children('.senior-sub:eq(' + index + ')').removeClass('hide');
}).on('mouseleave', '.attr', function() {
var $this = $(this),
index = $this.index();
hoveredIndex = index;
seniorHoverTime = setTimeout(function() {
hideSeniorPanel();
}, 100);
});
//【高级选项】多选
$('.senior-sub').on('click', '.multi-select', function() {
$(this).closest('.senior-sub').addClass('multi');
}).on('click', '.multi-select-ok', function() {
var $btn = $(this),
$sub = $btn.closest('.senior-sub'),
val = '';
if ($btn.hasClass('dis')) {
return;
}
$sub.find('.checked').each(function() {
var id = $(this).data('id');
val += (val === '') ? id : (',' + id);
});
uriLoc($sub.data('attr'), val);
}).on('mouseenter', function() {
clearTimeout(seniorHoverTime);
}).on('mouseleave', function() {
hideSeniorPanel();
});
\ No newline at end of file
... ...
... ... @@ -4,420 +4,8 @@
* @date: 2015/11/23
*/
var $ = require('yoho.jquery');
require('./filter');
var checkUnicode = {
unchecked: '&#xe613;',
checked: '&#xe612;'
},
moreUnicode = {
up: '&#xe610;',
down: '&#xe600;'
};
require('./sort-pager');
//品牌相关变量
var $brandDefault = $('.brand .default'),
$brandPanel = $('.brand .brand-panel'),
$brandAttrs = $('.brand .attr'),
$brandMore = $('#brand-more'),
$brandMulti = $('#brand-multi');
var $brandMoreTxt, $brandMoreIcon;
//商品相关变量
var $goodsContainer = $('.goods-container'),
$goodItem = $goodsContainer.find('.good-info'),
$goodItemWrapper = $goodsContainer.find('.good-item-wrapper'),
$goodInfoMain = $goodsContainer.find('.good-info-main'),
$goodSelectColor = $goodsContainer.find('.good-select-color');
//价格相关变量
var $udPrice = $('.ud-price-range'),
interReg = /^\d+$/,
$limit, $min, $max, $btn;
//分类相关变量
var $sortSub = $('.sort-sub-wrap');
//高级选项相关变量
var $seniorSubWrap = $('.senior-sub-wrap'),
$seniorAttrWrap = $('.senior-attr-wrap');
var seniorHoverTime, hoveredIndex;
//清除checkbox选中状态
function clearChecked($checkbox) {
$checkbox.removeClass('checked').html(checkUnicode.unchecked);
}
//显示更多品牌面板
function brandShowMore() {
$brandDefault.addClass('hide');
$brandPanel.removeClass('hide');
}
//隐藏更多品牌面板
function brandHideMore() {
$brandPanel.addClass('hide');
$brandDefault.removeClass('hide');
}
//url构造&跳转
function uriLoc(attr, val) {
var href = decodeURIComponent(window.location.search),
query = attr + '=' + val,
newHref;
if (href === '') {
newHref = '?' + query;
} else {
newHref = href + '&' + query;
}
window.location.href = newHref;
}
//隐藏高级选项面板
function hideSeniorPanel(index) {
$seniorSubWrap.children('.senior-sub:eq(' + hoveredIndex + ')').addClass('hide');
$seniorAttrWrap.children('.attr:eq(' + hoveredIndex + ')').removeClass('hover');
hoveredIndex = -1;
}
//屏蔽筛选项双击文字选中
$('.filter-box').on('selectstart', '.attr, .brands-index span', function() {
return false;
});
//【分类】
$('.sort-pre').on('click', 'li', function() {
var index = $(this).index();
$sortSub.children(':not(.hide)').addClass('hide');
$sortSub.children(':eq(' + index + ')').removeClass('hide');
});
//【品牌】
if ($brandMore.length > 0) {
$brandMoreTxt = $brandMore.children('em');
$brandMoreIcon = $brandMore.children('.iconfont');
}
//【品牌】多选
$brandMulti.click(function() {
if ($brandPanel.css('display') === 'none') {
//显示品牌面板
brandShowMore();
}
$brandPanel.addClass('multi'); //显示出checkbox
$(this).addClass('hide');
});
//【品牌】更多
$brandMore.click(function() {
var $this = $(this);
if ($this.hasClass('more')) {
brandHideMore();
$brandMoreTxt.text('更多');
$brandMoreIcon.html(moreUnicode.down);
} else {
brandShowMore();
$brandMoreTxt.text('收起');
$brandMoreIcon.html(moreUnicode.up);
}
$(this).toggleClass('more');
});
//【品牌】索引
$('.brands-index').on('click', 'span', function() {
var $this = $(this),
index = $this.data('index');
if ($this.index() === 0) {
//全部
$brandAttrs.removeClass('hide');
} else {
$brandAttrs.addClass('hide').filter('[data-index=' + index + ']').removeClass('hide');
}
});
//【品牌】搜索
$('#brand-search-input').keyup(function() {
var val = $(this).val().toLowerCase();
if (val === '') {
$brandAttrs.removeClass('hide');
} else {
$brandAttrs.addClass('hide').filter('[data-key*=' + val + ']').removeClass('hide');
}
});
//【品牌】多选确定
$('#brand-multi-ok').click(function() {
var val = '';
if ($(this).hasClass('dis')) {
return;
}
$brandPanel.find('.checked').each(function() {
var id = $(this).data('id');
val += (val === '') ? id : (',' + id);
});
uriLoc('brand', val);
});
//【品牌/高级选项】多选取消
$('.multi-select-cancel').click(function() {
var $panel = $(this).closest('.multi');
if ($panel.hasClass('brand-panel')) {
brandHideMore();
$brandMulti.removeClass('hide'); //显示多选按钮
}
$panel.removeClass('multi');
clearChecked($panel.find('.checkbox.checked')); //清除选中状态
});
//【品牌/高级选项】checkbox
$('.check-container').on('click', '.attr', function() {
var $this = $(this),
$check = $this.find('.checkbox'),
$btnOk = $this.parent('.check-container').next('.btns').find('.multi-select-ok');
$check.toggleClass('checked');
if ($check.hasClass('checked')) {
$check.html(checkUnicode.checked);
} else {
$check.html(checkUnicode.unchecked);
}
//更新按钮状态
if ($check.hasClass('checked') ||
$this.siblings('.attr').find('.checked').length > 0) {
$btnOk.removeClass('dis');
} else {
$btnOk.addClass('dis');
}
});
//【品牌/高级选项】当多选时阻止链接默认跳转
$('.brand, .senior').on('click', '.attr > a', function(e) {
if ($(this).closest('.multi').length > 0) {
e.preventDefault();
}
});
//【价格】用户定义价格处理
if ($udPrice.length > 0) {
$limit = $udPrice.find('.limit');
$min = $limit.filter('.min');
$max = $limit.filter('.max');
$btn = $udPrice.find('.price-sure');
//【价格】输入
$limit.keyup(function() {
var min = $.trim($min.val()),
max = $.trim($max.val()),
isMinInt = interReg.test(min),
isMaxInt = interReg.test(max);
if (isMaxInt && (min === '' || isMinInt) ||
isMinInt && (max === '' || isMaxInt)
) {
$btn.removeClass('hide');
} else {
$btn.addClass('hide');
}
});
//【价格】多项查询
$btn.click(function() {
var min = $.trim($min.val()),
max = $.trim($max.val()),
tmp;
//对于min大于max的情况,交换位置
if (min !== '' && max !== '' && +min > +max) {
tmp = max;
max = min;
min = tmp;
}
uriLoc('price', min + ',' + max);
});
}
//【高级选项】鼠标移入显示子项
$seniorAttrWrap.on('mouseenter', '.attr', function() {
var index = $(this).addClass('hover').index();
$seniorSubWrap.children('.senior-sub:eq(' + index + ')').removeClass('hide');
}).on('mouseleave', '.attr', function() {
var $this = $(this),
index = $this.index();
hoveredIndex = index;
seniorHoverTime = setTimeout(function() {
hideSeniorPanel();
}, 100);
});
//【高级选项】多选
$('.senior-sub').on('click', '.multi-select', function() {
$(this).closest('.senior-sub').addClass('multi');
}).on('click', '.multi-select-ok', function() {
var $btn = $(this),
$sub = $btn.closest('.senior-sub'),
val = '';
if ($btn.hasClass('dis')) {
return;
}
$sub.find('.checked').each(function() {
var id = $(this).data('id');
val += (val === '') ? id : (',' + id);
});
uriLoc($sub.data('attr'), val);
}).on('mouseenter', function() {
clearTimeout(seniorHoverTime);
}).on('mouseleave', function() {
hideSeniorPanel();
});
//操作栏
(function() {
var $countPerPage = $('#count-per-page'),
$countChose = $countPerPage.next('ul');
var SLIDETIME = 200;
$(document).click(function(e) {
if ($(e.target).closest('.page-count').length > 0) {
return;
}
$countChose && $countChose.slideUp(SLIDETIME);
});
$countPerPage.click(function() {
if ($countChose.css('display') === 'none') {
$countChose.slideDown(SLIDETIME);
} else {
$countChose.slideUp(SLIDETIME);
}
});
}());
/*
* Description: 商品列表移入效果
* Added by wangchenglong at 2015/12/1
*/
// 构造html
function createColorList(data) {
var colorListStr = '',
len = data.length,
row = 4, //每列ul放4个li
col = Math.ceil(len / row), //需要几**列**ul
i,
j,
index,
ulNum = 0;
for (i = 0; i < col; i++) {
colorListStr += '<ul>';
for (j = 0; j < row; j++) {
index = i * row + j;
if (index === len) {
break;
}
colorListStr +=
'<li>' +
'<a href="' + data[i * row + j].url + '">' +
'<img src="' + data[i * row + j].src + '" />' +
'</a>' +
'</li>';
if (j === row - 1) {
colorListStr += '</ul>';
ulNum++;
}
}
}
if (ulNum < col) {
colorListStr += '</ul>';
}
return colorListStr;
}
//todo
$goodItem.mouseenter(function() {
var $cloneStr,
activeIndex,
X,
left,
Y,
top,
colNum = 5,
itemW = 222,
itemH = 400,
itemMr = 10,
itemMb = 35;
activeIndex = $(this).index() + 1;
X = (activeIndex % colNum) === 0 ? colNum : activeIndex % colNum;
Y = Math.ceil(activeIndex / colNum);
left = (X - 1) * (itemW + itemMr) + 15 - 21;
top = (Y - 1) * (itemH + itemMb) + 25 - 19;
$cloneStr = $(this).clone();
$goodInfoMain.html('');
$goodSelectColor.html('');
$goodItemWrapper.css({
display: 'none'
});
$.ajax({
type: 'GET',
url: '/product/index/productColor',
dataType: 'json'
}).then(function(data) {
$goodInfoMain.append($cloneStr);
$goodSelectColor.append($(createColorList(data)));
});
$goodItemWrapper.css({
left: left,
top: top,
display: 'inline-block'
});
});
$goodItemWrapper.mouseleave(function() {
$goodInfoMain.html('');
$goodSelectColor.html('');
$goodItemWrapper.css({
display: 'none'
});
});
\ No newline at end of file
require('./product');
\ No newline at end of file
... ...
/**
*Description: 商品列表页
*Author: chenglong.wang@yoho.cn
*Date: 2015/12/2
*/
var $ = require('yoho.jquery'),
productEvent = require('../common/product-event');
var $goodsContainer = $('.goods-container'),
$goodItem = $goodsContainer.find('.good-info'),
$goodItemWrapper = $goodsContainer.find('.good-item-wrapper'),
$goodInfoMain = $goodsContainer.find('.good-info-main'),
$goodSelectColor = $goodsContainer.find('.good-select-color'),
$productListNav = $('.product-list-nav'),
productList;
/**
* @description 初始化鼠标移入商品列表弹层效果
* @num 每列存放商品的个数
*/
exports.init = function(num) {
productList = productEvent($goodItem, num);
/**
* @description 构造商品颜色列表的html结构
* @param data 商品颜色的数组,[url: '',src: '']
* @return json {'colorListStr': '', 'ulNum': ''}
* */
function createColorList(data) {
var colorListStr = '',
len = data.length,
row = 4, //每列ul放4个li
col = Math.ceil(len / row), //需要几**列**ul
i,
j,
index,
ulNum = 0;
for (i = 0; i < col; i++) {
colorListStr += '<ul>';
for (j = 0; j < row; j++) {
index = i * row + j;
if (index === len) {
break;
}
colorListStr +=
'<li>' +
'<a href="' + data[i * row + j].url + '">' +
'<img src="' + data[i * row + j].src + '" />' +
'</a>' +
'</li>';
if (j === row - 1) {
colorListStr += '</ul>';
ulNum++;
}
}
}
if (ulNum < col) {
colorListStr += '</ul>';
}
return {
colorListStr: colorListStr,
ulNum: col
};
}
productList.addHandler('MouseEnter', function(event) {
var itemMr = 10, //list的右边距
itemMb = 35, //list的下边距
ulStr = '',
ulNum,
wrapperWidth,
diffWidth,
wrapperX,
wrapperY,
wrapperPl, //鼠标移入时弹层的左内边距
wrapperPt, //鼠标移入时弹层的上内边距
containerPt; //商品列表容器的上内边距
$goodInfoMain.html('');
$goodSelectColor.html('');
$goodItemWrapper.css({
display: 'none'
});
$.ajax({
type: 'GET',
url: '/product/index/productColor',
dataType: 'json'
}).then(function(data) {
ulStr = createColorList(data).colorListStr; //ajax请求的颜色列表
ulNum = createColorList(data).ulNum;//ajax请求的颜色的数量
$goodInfoMain.append(event.targetDuplicate);
$goodSelectColor.append($(ulStr));
wrapperPl = $goodItemWrapper.css('paddingLeft');
wrapperPt = $goodItemWrapper.css('paddingTop');
containerPt = $goodsContainer.css('paddingTop');
wrapperWidth = 10 + (15 + 50) * ulNum + event.targetWidth;
wrapperX = (event.targetX - 1) * (event.targetWidth + itemMr) - (parseInt(wrapperPl) + 1);
wrapperY = (event.targetY - 1) *
(event.targetHeight + itemMb) + parseInt(containerPt) - (parseInt(wrapperPt) + 1);
//todo
diffWidth = event.offsetR - ((15 + 50) * ulNum + 25);
if (diffWidth <= 0) {
wrapperX = wrapperX + diffWidth;
}
$goodItemWrapper.css({
width: wrapperWidth,
left: wrapperX,
top: wrapperY,
display: 'inline-block'
});
});
});
$goodItemWrapper.mouseleave(function() {
$goodInfoMain.html('');
$goodSelectColor.html('');
$goodItemWrapper.css({
display: 'none'
});
});
// 左侧导航
$productListNav.click(function() {
if ($(this).hasClass('active')) {
$(this).find('.sort-child-list').stop(true, true).slideUp();
} else {
$(this).find('.sort-child-list').stop(true, true).slideDown();
}
$(this).toggleClass('active');
});
};
\ No newline at end of file
... ...
/**
* 筛选页和列表页操作banner中的每页N个商品选择逻辑
* @author: xuqi<qi.xu@yoho.cn>
* @date: 2015/12/4
*/
var $ = require('yoho.jquery');
var $countPerPage = $('#count-per-page'),
$countChose = $countPerPage.next('ul');
var SLIDETIME = 200;
$(document).click(function(e) {
if ($(e.target).closest('.page-count').length > 0) {
return;
}
$countChose && $countChose.slideUp(SLIDETIME);
});
$countPerPage.click(function() {
if ($countChose.css('display') === 'none') {
$countChose.slideDown(SLIDETIME);
} else {
$countChose.slideUp(SLIDETIME);
}
});
\ No newline at end of file
... ...
... ... @@ -15,7 +15,8 @@
"dependencies": {
"yoho.lazyload": "1.0.0",
"yoho.handlebars": "3.0.3",
"yoho.jquery": "1.8.3"
"yoho.jquery": "1.8.3",
"json2": "1.0.0"
},
"devDependencies": {
"expect.js": "0.3.1"
... ...
... ... @@ -126,4 +126,7 @@ var $yohocookie = require('./yohocookie');
return shoppingData._k;
},
})
})(jQuery);
\ No newline at end of file
})(jQuery);
exports.init = function() {
}
\ No newline at end of file
... ...
@font-face {
font-family: 'icomoon';
src:font-url('icomoon.eot');
src:font-url('icomoon.eot?#iefix') format('embedded-opentype'),
font-url('icomoon.ttf') format('truetype'),
font-url('icomoon.woff') format('woff'),
font-url('icomoon.svg#icomoon') format('svg');
font-weight: normal;
font-style: normal;
}
.yoho-footer {
font-size: 12px;
/*----文字颜色----*/
.red{
color: #ee0011;
.left {
float: left;
}
.orange{
color: #f9761a;
.right {
float: right;
}
.rgb0{
color: #000;
.center {
text-align: center;
}
.rgb2{
color: #222;
* {
box-sizing: border-box;
}
.rgb4{
color: #444;
.red {
color: #ee0011;
}
.rgb6{
.rgb6 {
color: #666;
}
.rgb9{
.rgb9 {
color: #999;
}
.rgbc{
color: #ccc;
}
.rgbf{
.rgbf {
color: #fff;
}
.blue{
color: #006699;
}
.blue2{
color: #468fa2;
}
/**函数类**/
.hidden{ display:none !important;}
.show{ display:block;}
.left{float: left;}
.right{float: right;}
.relative{position: relative;}
.absolute{position: absolute;}
.inline-block{
display: inline-block;
}
.top{
vertical-align: top;
}
.middle{
vertical-align: middle;
}
.center{
text-align: center;
}
.footertop {
.index-foot {
background: #eeeeee;
padding:20px 0;
}
.index-foot dd{
.index-foot {
background: #eeeeee;
padding:20px 0;
dd {
width: 370px;
margin-right: 20px;
float: left;
overflow:hidden;
}
.index-foot dd.last{
margin-right: 0;
}
.index-foot dd .foot-panel{
background: #fff;
padding: 20px;
_padding-right: 10px;
}
.index-foot dd .title{
text-align: center;
_zoom:1;
}
.index-foot dd .title .title-line{
border-bottom: 1px solid #dddddd;
position: absolute;
top: 9px;
width: 100%;
left: 0;
*top: -6px;
}
.index-foot dd .title .text{
position: absolute;
width: 100%;
text-align: center;
left: 0;
top: 0;
}
.index-foot dd .title .text span{
background: #fff;
font-size: 18px;
line-height: 18px;
padding: 0 10px;
}
.index-foot dd ul{
margin-top: 18px;
padding-top: 18px;
}
.index-foot dd .two-dim{
margin-right: -10px;
}
.index-foot dd .two-dim li{
border: 1px solid #ddd;
padding: 7px;
margin-right: 10px;
}
&.last {
margin-right: 0;
}
.foot-panel {
background: #fff;
padding: 20px;
}
.index-foot dd .two-dim img.dim-img{
/*opacity: 0.5;
filter:alpha(opacity=50);*/
}
.index-foot dd .two-dim .dim-hover{
position: absolute;
}
.index-foot dd .two-dim .dim-hover img{
width: 38px;
height: 38px;
}
.index-foot dd .two-dim .dim-active .dim-img{
opacity: 1;
filter:alpha(opacity=100);
}
.index-foot dd .two-dim .dim-active .dim-hover{
display: none;
}
.index-foot dd .two-dim li a{
display: block;
}
.index-foot dd .two-dim li p{
text-align: center;
margin-top: 13px;
margin-bottom: 3px;
line-height: 12px;
}
.index-foot dd .item-nav{
padding-top: 20px;
}
.index-foot dd .item-nav a{
color: #999;
padding: 0 3px;
cursor:pointer;
}
.index-foot .vote{
height: 131px;
line-height: 24px;
}
.index-foot .vote input{
margin: 0 5px 0 1px;
}
.index-foot .vote .button{
height: 24px;
line-height: 24px;
width: 55px;
font-size: 12px;
margin-top: 10px;
margin-right: 10px;
background: #222;
color: #fff;
display: inline-block;
text-align: center;
}
.index-foot .vote p{
height: 24px;
overflow: hidden;
}
.index-foot .vote .vote-item p{
float: left;
width: 50%;
.title {
position: relative;
text-align: center;
}
}
.title-line {
border-bottom: 1px solid #dddddd;
position: absolute;
top: 9px;
width: 100%;
left: 0;
}
.index-foot .vote textarea{
width: 98%;
height: 60px;
vertical-align: middle;
margin: 5px 0px 0px 0px;
resize:none;
}
.text {
position: absolute;
width: 100%;
text-align: center;
left: 0;
top: 0;
span {
background: #fff;
font-size: 18px;
line-height: 18px;
padding: 0 10px;
}
}
.index-foot ul.mobile{
margin-right: -10px;
}
.index-foot .mobile li{
margin-right: 10px;
float: left;
margin-bottom: 12px;
}
ul {
margin-top: 18px;
padding-top: 18px;
}
.index-foot dd li{
/*height: 131px;*/
zoom:1;
}
.two-dim {
margin-right: -10px;
overflow: hidden;
.index-banner{
width: 100%;
margin-top: 20px;
}
.ifont10{
font-family: "icomoon" ;
display:inline-block;
font-size: 13px;
line-height: 10px;
-webkit-transform:scale(0.8);
}
}
.footerbottom {
width: 100%;
.promise {
padding: 20px 0 10px 0;
background: #000;
.left {
line-height: 30px;
font-size: 12px;
font-weight: bold;
.ifont {
font-size: 24px;
line-height: 24px;
vertical-align: middle;
margin-right: 5px;
font-weight: normal;
font-family: "icomoon" ;
display:inline-block;
li {
border: 1px solid #ddd;
padding: 7px;
margin-right: 10px;
a {
display: block;
}
p {
text-align: center;
margin-top: 13px;
margin-bottom: 3px;
line-height: 12px;
}
}
}
}
.subscribe {
border: 1px solid #262626;
input {
height: 32px;
padding: 0 10px;
line-height: 32px;
border: none;
margin: 0;
*height: 28px;
*line-height: 28px;
background: #000;
&.wrong{
color: #ee0011;
.dim-img {
display: block;
width: 87px;
height: 87px;
}
.dim-hover {
position: absolute;
img {
width: 38px;
height: 38px;
}
}
a {
margin-left: 10px;
font-size: 18px;
line-height: 32px;
opacity: 0.5;
filter: alpha(opacity=50);
.dim-active .dim-img {
opacity: 1;
filter:alpha(opacity=100);
}
}
.footer-help {
background: #000;
font-size: 12px;
ul {
width: 110%;
.dim-active .dim-hover {
display: none;
}
li p {
line-height: 24px;
span{
.item-nav{
padding-top: 20px;
span {
color: #fff;
padding: 0 3px;
cursor:pointer;
font-size: 20px;
}
a {
color: #666;
&:hover {
text-decoration: underline;
}
.cur {
color: #999;
}
}
.screen {
border-top: 1px solid #262626;
padding: 15px 0;
}
}
.client-title p {
.vote {
line-height: 24px;
}
.client {
padding-top: 6px;
a.ifont {
font-size: 20px;
background: #444;
width: 32px;
height: 32px;
margin-right: 3px;
text-align: center;
line-height: 32px;
}
}
.footer-link{
background: #000;
padding: 10px 0 30px 0;
font-size: 12px;
}
.about-us {
margin-left: 10px;
line-height: 20px;
color: #666;
a {
color: #666;
}
p span {
padding: 0 10px;
input {
margin: 0 5px 0 1px;
}
}
.footer-link .right-flag a {
margin-right: 5px;
}
.footer-client {
padding: 0px;
bottom: 25px;
left: -37px;
z-index: 10;
width: 106px;
top: -140px;
.client-img {
background: #fff;
.button {
height: 24px;
line-height: 24px;
width: 55px;
font-size: 12px;
margin-top: 10px;
margin-right: 10px;
background: #222;
color: #fff;
display: inline-block;
text-align: center;
cursor: pointer;
}
a {
padding: 8px;
background: #fff;
display: block;
p {
text-align: center;
padding-top: 5px;
}
p {
height: 24px;
overflow: hidden;
}
.arrow {
line-height: 12px;
text-align: center;
width: 100%;
font-size: 12px;
vertical-align: top;
margin-top: -2px;
textarea{
width: 98%;
height: 68px;
vertical-align: middle;
margin: 5px 0px 0px 0px;
resize:none;
}
}
.right-flag{
margin-top: 3px;
}
}
.return-top {
position: fixed;
width: 60px;
height: 60px;
font-size: 18px;
text-align: center;
line-height: 60px;
color: #fff;
background: #000;
opacity: 0.5;
filter: alpha(opacity=50);
bottom: 20px;
cursor: pointer;
z-index: 99999;
&:hover {
opacity: 0.9;
filter: alpha(opacity=90);
}
}
}
@media (max-width:1310px){
.yoho-footer{
.return-top{
left: 100%;
right: 20px;
margin-left: auto;
}
}
}
@media (min-width:1310px){
.yoho-footer{
.return-top{
left: 50%;
margin-left: 595px;
}
}
}
@media (max-width:1180px){
.yoho-footer {
.screen{
width: 990px;
margin-left: auto;
margin-right: auto;
}
.screen-l{
display: none;
}
.footerbottom{
min-width: 990px;
}
.footerbottom .footer-right{
width: 200px;
width: 202px \9;
}
.footerbottom .footer-help ul{
/*width: 690px;*/
}
.footerbottom .footer-help li{
width: 150px;
}
.footerbottom .promise .left{
margin-right: 45px;
}
.footerbottom .subscribe input{
width: 140px;
outline: none;
}
.vote-item p {
float: left;
width: 50%;
/*trends*/
.article-list{
width: 670px;
}
.article-list ul .article-cover img{
width: 320px;
height: 214px;
}
.article-list ul .article-summary{
width: 330px;
height: 214px;
overflow: hidden;
}
.trends-suggestion ul li{
width: 208px;
}
.trends-suggestion ul li img{
width: 208px;
height: 138px;
}
.article-list .article-detail img{
max-width: 670px;
}
/*lookbook*/
.trends-list ul li{
width: 232px;
}
.trends-list ul li a img{
width: 232px;
height: 330px;
}
.trends-list ul li p{
width: 222px;
}
.mobile {
margin-right: -10px;
.focus-top3{
height: 618px;
}
.focus-top3 .focus-img img{
width: 495px;
height: 618px;
}
.focus-top3 ul li, .trends-content iframe{
height: 618px;
width: 990px;
}
}
}
@media (min-width:1180px){
.yoho-footer{
.screen{
width: 1150px;
margin-left: auto;
margin-right: auto;
}
.footerbottom .footer-right{
width: 240px;
width: 242px \9;
}
.footerbottom .footer-help ul{
/*width: 810px;*/
}
.footerbottom .footer-help li{
width: 180px;
}
.footerbottom .promise .left{
margin-right: 60px;
}
.footerbottom .subscribe input{
width: 180px;
outline: none;
}
li {
margin-right: 10px;
float: left;
}
/*trends*/
.article-list{
width: 830px;
}
.article-list ul .article-cover img{
width: 360px;
height: 240px;
}
.article-list ul .article-summary{
width: 450px;
height: 240px;
overflow: hidden;
}
.trends-suggestion ul li{
width: 262px;
}
.trends-suggestion ul li img{
width: 262px;
height: 175px;
}
.article-list .article-detail img{
max-width: 830px;
img {
display: block;
width: 103px;
height: 131px;
}
}
/*lookbook*/
.trends-list ul li{
width: 272px;
}
.trends-list ul li a img{
width: 272px;
height: 388px;
}
.trends-list ul li p{
width: 262px;
}
.focus-top3{
height: 716px;
}
.focus-top3 .focus-img img{
width: 575px;
height: 716px;
}
.focus-top3 ul li, .trends-content iframe{
height: 716px;
width: 1150px;
.index-banner {
width: 100%;
margin-top: 20px;
}
}
}
/* new index 990 */
@media (max-width:1180px){
.sort-enter a, .sort-enter a img{
width:494px;
height:388px;
}
.sort-enter a span{
bottom:40px;
}
.new-arrial img{
width:990px;
}
.arrial-list ul li, .arrial-list ul li img{
width:325px;
height: 265px;
}
.hot-brand .con{
height: 103px;
}
.hot-brand .con .btn-page{
width:90px;
height:103px;
background-position: -106px 0;
}
.hot-brand .con .btn-page a{
width: 30px;
height:30px;
}
.hot-brand .con .btn-page a.page-before{
top: 22px;
left: 8px;
}
.hot-brand .con .btn-page a.page-next{
top: 50px;
left: 44px;
}
.hot-brand .con .list{
margin-right: 90px;
}
.hot-brand .con .list ul li img{
width:100px;
height:103px;
}
}
@media (min-width:1180px){
.sort-enter a, .sort-enter a img{
width:574px;
height:450px;
}
.sort-enter a span{
bottom:50px;
}
.new-arrial img{
width:1150px;
}
.arrial-list ul li, .arrial-list ul li img{
width:378px;
height:308px;
}
.hot-brand .con{
height: 120px;
}
.hot-brand .con .btn-page{
width:106px;
height:120px;
background-position: 0 0;
}
.hot-brand .con .btn-page a{
width: 40px;
height:40px;
}
.hot-brand .con .btn-page a.page-before{
top: 24px;
left: 4px;
}
.hot-brand .con .btn-page a.page-next{
top: 58px;
left: 50px;
}
.hot-brand .con .list{
margin-right: 106px;
}
.hot-brand .con .list ul li img{
width:116px;
height:120px;
}
}
/*new index*/
@media (max-width:1180px){
/*
.page-index-new .screen{
width: 988px;
}*/
.focus-top2{
height: 388px;
}
.focus-top2 .focus-img img{
width: 988px;
height: 388px;
}
.focus-bottom ul{
padding: 0 1px;
height: 46px;
overflow: hidden;
}
.focus-bottom ul li img{
width: 118px;
height: 46px;
}
.focus-bottom ul li a{
width: 118px;
height: 46px;
}
#bigSlide{
width: 988px;
height: 388px;
}
#bigSlide li{
width: 988px;
height: 388px;
}
.footerbottom {
width: 100%;
.dl-index .hot-brands li a img{
width: 163px;
height: 163px;
}
.dl-index .hot-brands li.li-h-2 a img{
width: 328px;
}
.dl-index .hot-brands li.li-v-2 a img{
height: 328px;
}
.dl-index .hot-brands li .btn-page{
padding: 36px 0 0 36px;
width: 127px;
height: 127px;
}
.wrapper-index2{
width: 988px;
}
.wrapper-index2 .index-unit-5{
width: 823px;
}
.wrapper-index2 .index-unit-1{
width: 163px;
}
.wrapper-index2 .index-unit-5 ul.hot-brands{
height: 330px;
}
.dl-index .index-ul li a img{
width: 163px;
height: 206px;
}
.dl-index .index-ul li.li-h-2 a img{
width: 328px;
}
.wrapper-index2 .index-ads img{
width: 163px;
}
.wrapper-index2 .index-ads .ads-1 img{
height: 279px;
}
.wrapper-index2 .index-ads .ads-2 img{
height: 163px;
}
.promise {
padding: 20px 0 10px 0;
background: #000;
.dl-index .category-top img{
width: 163px;
height: 146px;
}
.dl-index .category-list{
padding: 7px 0;
}
.dl-index .category-list li{
width: 76px;
}
.dl-index .category-list li a{
padding: 0px 0 0px 15px;
height: 24px;
line-height: 24px;
}
.dl-index .brands-list{
padding: 7px 0;
}
.dl-index .brands-list li a{
line-height: 24px;
height: 24px;
padding: 0px 15px 0px 15px;
.left {
margin-right: 60px;
line-height: 30px;
font-size: 12px;
font-weight: bold;
}
}
.index-foot dd{
width: 316px;
.subscribe {
border: 1px solid #262626;
width: 240px;
}
.index-foot dd .two-dim img.dim-img{
width: 69px;
height: 69px;
}
.index-foot .mobile li img{
width: 85px;
height: 108px;
}
.index-foot ul.mobile{
margin-top: 30px;
padding-bottom: 11px;
height: 108px;
overflow: hidden;
}
.index-foot dd .two-dim{
margin-top: 26px;
margin-bottom: 10px;
/*padding-bottom: 10px;*/
height: 113px;
overflow: hidden;
}
input {
width: 180px;
height: 32px;
padding: 0 10px;
line-height: 32px;
border: none;
margin: 0;
background: #000;
}
.index-foot dd .two-dim .dim-hover{
left: 16px;
top: 16px;
}
/*hotBrand*/
.dl-index .hot-brand-new .ids img{
width:163px;
}
.hot-brand-new .recommendBox-new{
width:891px;
height:156px;
}
.hot-brand-new .recommendBox-new ul li{
width:99px;
height:78px;
}
.hot-brand-new .recommendBox-new ul li img{
width:99px;
height:78px;
}
.dl-index .hot-brand-new .index-unit-1{
width:97px;
height:156px;
}
.dl-index .hot-brand-new .index-unit-1 ul li{
width:97px;
height:78px;
}
.dl-index .hot-brand-new .index-unit-1 ul li img{
width:97px;
height:78px;
}
.dl-index .hot-brand-new .btn-page{
width:97px;
height:78px;
background: url('http://static.yohobuy.com/images/v3/icon/btn_page_small.jpg') no-repeat center center ;
}
/*猜你喜欢*/
.index-guess-like li{
width: 163px;
float: left;
margin-right: 2px;
text-align: center;
}
.index-guess-like li img{
width: 163px;
a {
margin-left: 10px;
font-size: 18px;
line-height: 32px;
opacity: 0.5;
filter: alpha(opacity=50);
}
}
}
@media (min-width:1180px){
.focus-top2{
height: 450px;
}
.focus-top2 .focus-img img{
width: 1150px;
height: 450px;
}
.focus-bottom ul{
padding: 0 2px;
height: 54px;
.footer-help {
background: #000;
font-size: 12px;
overflow: hidden;
}
.focus-bottom ul li img{
width: 138px;
height: 54px;
}
.focus-bottom ul li a{
width: 138px;
height: 54px;
}
#bigSlide{
width: 1150px;
height: 450px;
}
#bigSlide li{
width: 1150px;
height: 450px;
}
.dl-index .hot-brands li a img{
width: 190px;
height: 190px;
}
.dl-index .hot-brands li.li-h-2 a img{
width: 382px;
}
.dl-index .hot-brands li.li-v-2 a img{
height: 382px;
}
.dl-index .hot-brands li .btn-page{
padding: 50px 0 0 50px;
width: 140px;
height: 140px;
}
.wrapper-index2 .index-unit-5{
width: 958px;
}
.wrapper-index2 .index-unit-1{
width: 190px;
}
.wrapper-index2 .index-unit-5 ul.hot-brands{
height: 384px;
}
.dl-index .index-ul li a img{
width: 190px;
height: 240px;
}
.dl-index .index-ul li.li-h-2 a img{
width: 382px;
}
.wrapper-index2 .index-ads img{
width: 190px;
}
.wrapper-index2 .index-ads .ads-1 img{
height: 320px;
}
.wrapper-index2 .index-ads .ads-2 img{
height: 190px;
}
ul {
width: 110%;
}
.dl-index .category-top img{
width: 190px;
height: 170px;
}
p {
line-height: 24px;
.dl-index .category-list{
padding: 8px 0;
}
.dl-index .category-list li{
width: 90px;
}
.dl-index .category-list li a{
padding: 0px 0 0px 15px;
height: 28px;
line-height: 28px;
}
.dl-index .brands-list{
padding: 8px 0;
}
.dl-index .brands-list li a{
line-height: 28px;
height: 28px;
padding: 0px 15px 0px 15px;
}
span {
color: #fff;
}
.index-foot dd{
width: 370px;
a {
color: #666;
}
.index-foot dd .two-dim{
overflow: hidden;
}
.index-foot dd .two-dim img.dim-img{
width: 87px;
height: 87px;
}
.index-foot .mobile li img{
width: 103px;
height: 131px;
}
&:hover {
text-decoration: underline;
}
}
}
.index-foot dd .two-dim .dim-hover{
left: 25px;
top: 25px;
}
.index-foot ul.mobile{
height: 131px;
overflow: hidden;
}
/*hotBrand*/
.dl-index .hot-brand-new .ids{
width:190px;
}
.hot-brand-new .recommendBox-new{
width:1035px;
height:180px;
}
.hot-brand-new .recommendBox-new ul li{
width:115px;
height:90px;
}
.hot-brand-new .recommendBox-new ul li img{
width:115px;
height:90px;
}
.dl-index .hot-brand-new .index-unit-1{
width:115px;
height:180px;
li {
width: 180px;
}
.screen {
border-top: 1px solid #262626;
padding: 15px 0;
}
}
.dl-index .hot-brand-new .index-unit-1 ul li{
width:115px;
height:90px;
}
.dl-index .hot-brand-new .index-unit-1 ul li img{
width:115px;
height:90px;
}
.dl-index .hot-brand-new .btn-page{
width:115px;
height:90px;
background: url('http://static.yohobuy.com/images/v3/icon/btn_page_big.jpg') no-repeat center center ;
}
/*猜你喜欢*/
.index-guess-like li{
width: 190px;
height: 320px;
float: left;
margin-right: 2px;
text-align: center;
}
}
/*boys*/
.footer-link {
background: #000;
padding: 10px 0 30px 0;
font-size: 12px;
@media (max-width:1180px){
.wrapper-right{
width: 810px;
}
.wrapper-main .list-unit{
width: 195px;
.right-flag {
margin-top: 3px;
}
.wrapper-main .index-tab{
width: 615px; /*750*/
overflow: hidden;
}
.banner-zone .feedback .item-vote{
width: 150px;
padding: 10px;
overflow: hidden;
}
.wrapper-main .banner-zone div.phone .left-a{
padding-right: 5px;
}
.wrapper-main .banner-zone div.phone .right-a{
padding-left: 5px;
}
.banner-zone .recent-view .recent-goods{
width: 153px;
}
.banner-zone .recent-view .recent-goods img{
width: 50px;
height: 50px;
}
.focus-top{
height: 334px;
}
.focus-brands .focus-brands-wrapper{
width: 640px;
}
.focus-top .button-switch .ifont{
margin-top: 160px;
}
a {
margin-right: 5px;
}
}
}
.about-us {
line-height: 20px;
color: #666;
margin-left: 10px;
@media (min-width:1180px){
a {
color: #666;
}
.wrapper-right{
width: 970px; /*990px*/
span {
padding: 0 10px;
}
}
}
.wrapper-main .list-unit{
width: 235px; /*240*/
}
.wrapper-main .index-tab{
width: 735px; /*750*/
overflow: hidden;
}
.banner-zone .feedback .item-vote{
width: 170px;
padding: 20px;
overflow: hidden;
}
.wrapper-main .banner-zone div.phone .left-a{
padding-right: 20px;
}
.wrapper-main .banner-zone div.phone .right-a{
padding-left: 20px;
}
.banner-zone .recent-view .recent-goods{
width: 183px;
}
.banner-zone .recent-view .recent-goods img{
.return-top {
position: fixed;
width: 60px;
height: 60px;
}
.focus-top{
height: 400px;
}
.focus-brands .focus-brands-wrapper{
width: 800px;
}
.focus-top .button-switch .ifont{
margin-top: 185px;
}
}
left: 50%;
margin-left: 595px;
text-align: center;
line-height: 50px;
color: #fff;
background: #000;
opacity: 0.5;
filter: alpha(opacity=50);
bottom: 20px;
cursor: pointer;
&:hover {
opacity: 0.9;
filter: alpha(opacity=90);
}
/*brands*/
@media (max-width:1180px){
.brands-ad .ad-img1 img{
width: 490px;
height: 240px;
}
.brands-ad .ad-img2 img{
width: 240px;
height: 240px;
}
.brands-logo a{
/*margin-left: 19px;*/
margin-left: 18px;
}
.brands-logo a.first{
margin-left: 10px;
}
.wrapper-brands .brands-fixed{
width: 956px;
}
.wrapper-brands .brands-az a{
padding: 0 6px;
.iconfont {
font-size: 34px;
}
}
}
@media (min-width:1180px){
.brands-ad .ad-img1 img{
width: 570px;
height: 280px;
}
.brands-ad .ad-img2 img{
width: 280px;
height: 280px;
}
.brands-logo a{
margin-left: 35px;
}
.brands-logo a.first{
margin-left: 18px;
}
.wrapper-brands .brands-fixed{
width: 1116px;
@media (max-width: 1360px) {
.yoho-footer .return-top {
left: 100%;
right: 20px;
margin-left: auto;
}
}
/*goods list*/
@media (max-width:1180px){
.goods-list{
margin-right: -10px;
}
.goods-list .goods{
width: 195px;
margin-right: 10px;
height: 353px;
overflow: hidden;
}
/*
.goods-mini .goods-list{
margin-right: -12px;
}
.goods-mini .goods-list .goods{
width: 125px;
margin-right: 12px;
}*/
/*图片固定高度*/
.goods-list .goods img{
width: 195px;
height: 261px;
}
/*end*/
.sort-condition .sort-num{
display: none;
}
.goods-suggestion .goods-more{
/*display: none;*/
}
.brands-suggestion li a{
margin: 0 0 0 6px;
}
.brands-suggestion li a{
width: 130px;
}
.brands-suggestion li img{
padding: 22px 24px 22px 24px;
}
/*0124*/
.goods-suggestion .goods-list{
height: 353px;
overflow: hidden;
}
.goods-view .goods-list .goods{
width: 190px;
overflow: hidden;
}
}
@media (min-width: 1180px){
.goods-list{
margin-right: -10px;
}
.goods-list .goods{
width: 235px;
margin-right: 10px;
height: 406px;
}
.goods-mini .goods-list{
margin-right: -14px;
}
.goods-mini .goods-list .goods{
width: 150px;
margin-right: 14px;
height: 293px;
}
.goods-mini .goods-list .li-first-4{
clear: none;
}
.goods-mini .goods-list .li-first-6{
clear: left;
}
/*图片固定高度*/
.goods-list .goods img{
width: 235px;
height: 314px;
}
.goods-mini .goods-list .goods img{
width: 150px;
height: 201px;
}
/*end*/
.brands-suggestion li a{
margin: 0 0 0 8px;
}
.brands-suggestion li a{
width: 155px;
}
.brands-suggestion li img{
padding: 22px 37px 22px 36px;
}
.goods-suggestion .goods-list{
height: 293px;
overflow: hidden;
}
.goods-view .goods-mini .goods-list .goods{
margin-right: 16px;
}
}
@media (max-width:1180px) {
.yoho-footer {
.index-foot dd {
width: 316px;
.two-dim {
margin-top: 26px;
margin-bottom: 10px;
overflow: hidden;
}
.dim-img {
width: 69px;
height: 69px;
}
/*goods list top*/
.mobile img {
width: 85px;
height: 108px;
}
}
@media (max-width:1180px){
.goods-right{
width: 810px;
}
.subscribe {
width: 200px;
.goods-right .goods-ad .ad-text{
width: 748px;
/*height: 248px;*/
padding:0px 30px 30px 30px;
border:1px solid #eaeceb;
}
.goods-right .goods-ad .ad-half .ad-text{
width: 348px;
height: 218px;
}
.goods-right .goods-ad .ad-half-img{
width: 400px;
height: 250px;
}
.goods-right .goods-ad .ad-img{
width: 810px;
height: 250px;
}
.goods-right .goods-ad .text-title .title{
margin-top: 30px;
}
/*
.search-condition .search-selected p{
width: 640px;
}*/
}
input {
width: 140px;
}
}
@media (min-width:1180px){
.goods-right{
width: 970px;
}
.goods-right .goods-ad .ad-text{
width: 868px;
height: 298px;
padding:0px 50px;
border:1px solid #eaeceb;
}
.goods-right .goods-ad .ad-half .ad-text{
width: 388px;
height: 298px;
}
.goods-right .goods-ad .ad-half-img{
width: 480px;
height: 300px;
}
.goods-right .goods-ad .ad-img{
width: 970px;
height: 300px;
}
.goods-right .goods-ad .text-title .title{
margin-top: 60px;
.footer-help li {
width: 150px;
}
}
}
\ No newline at end of file
... ...