Authored by Lynnic

添加折叠框

... ... @@ -13,9 +13,9 @@ var goodsSwiper,
// winH = $(window).height(),
sizeSwiper,
refSwiper,
commentsNum,
handleHelper;
lazyLoad($('img.lazy'));
goodsSwiper = new Swiper('.banner-swiper', {
... ... @@ -28,11 +28,34 @@ goodsSwiper = new Swiper('.banner-swiper', {
prevButton: '.swiper-button-prev'
});
//初始化tab
(function() {
commentsNum = $('#nav-tab .comments-num').html()-0;
var consultsNum = $('#nav-tab .consults-num').html()-0;
$('#nav-tab li').each(function() {
$(this).removeClass('focus');
});
$('#feedback-content .content').each(function() {
$(this).addClass('hide');
});
if(0!=commentsNum) {
$('#nav-tab .comment-nav').addClass('focus');
$('#feedback-content .comment-content').removeClass('hide');
}else if(0!=consultsNum) {
$('#nav-tab .consult-nav').addClass('focus');
$('#feedback-content .consult-content').removeClass('hide');
}
})();
$('#nav-tab li').on('click', function() {
var index = $(this).index();
if($(this).hasClass('comment-nav')&&0==commentsNum) {
alert('暂无商品评价');
}else{
if (!$(this).hasClass('focus')) {
$('#nav-tab li').each(function() {
... ... @@ -45,6 +68,15 @@ $('#nav-tab li').on('click', function() {
$(this).addClass('focus');
$('#feedback-content .content:eq(' + index + ')').removeClass('hide');
}
}
});
$('.goodsDiscount .dropdown').on('click',function() {
if($('.goodsDiscount .discount-folder').is(':hidden')) {
$('.goodsDiscount .discount-folder').slideDown();
}else{
$('.goodsDiscount .discount-folder').slideUp();
}
});
sizeSwiper = new Swiper('#size-swiper-container',{
... ...
... ... @@ -225,15 +225,15 @@ overflow: hidden;
}
}
.goodsDiscount{
min-height: pxToRem(88px);
padding-left:pxToRem(28px);
padding-right:pxToRem(28px);
font-size: pxToRem(28px);
color: $mainFontC;
line-height: pxToRem(88px);
border-bottom: 1px solid $borderC;
h1{
padding : pxToRem(30px) pxToRem(28px);
line-height: pxToRem(36px);
// line-height: pxToRem(88px);
}
.iconfont{
display: inline-block;
width: pxToRem(35px);
... ... @@ -242,6 +242,13 @@ overflow: hidden;
color:#e0e0e0;
// padding-left:pxToRem(50px);
}
.discount-folder{
.folder-item{
border-top: 1px solid $borderC;
}
display: none;
}
}
.goodsSubtitle,
.goodsDiscount{
... ... @@ -511,6 +518,8 @@ overflow: hidden;
.detail-swiper{
.swiper-wrapper{
height: pxToRem(200px);
overflow: hidden;
.swiper-slide{
width: pxToRem(114px);
div{
... ... @@ -527,7 +536,6 @@ overflow: hidden;
}
#reference-swiper-container{
.first-group{
width: pxToRem(70px);
margin-top: pxToRem(66px);
... ...
... ... @@ -43,7 +43,15 @@
{{#goodsDiscount}}
<div class="goodsDiscount">
<h1>{{.}}<span class="iconfont">&#xe609;</span></h1>
{{#each list}}
{{#if @first}}
<h1>{{this}}<span class="iconfont dropdown">&#xe609;</span></h1>
<div class="discount-folder">
{{else}}
<h1 class="folder-item">{{this}}</h1>
{{/if}}
{{/list}}
</div>
</div>
{{/goodsDiscount}}
... ... @@ -57,8 +65,8 @@
{{else}}
<ul id="nav-tab" class="nav-tab clearfix">
<li class="comment-nav focus">{{commentName}}({{commentsNum}})</li>
<li class="consult-nav">{{consultName}}({{consultsNum}})</li>
<li class="comment-nav">{{commentName}}(<span class="comments-num">{{commentsNum}}</span>)</li>
<li class="consult-nav">{{consultName}}(<span class="consults-num">{{consultsNum}}</span>)</li>
</ul>
<div id="feedback-content" >
... ... @@ -189,7 +197,7 @@
<div class="swiper-container detail-swiper" id="size-swiper-container">
<div class="swiper-wrapper">
{{#list}}
<div class="swiper-slide blue-slide" >
<div class="swiper-slide " >
<div class="size-name cell">{{name}}</div>
<div class="size-m cell">{{sizem}}</div>
<div class="size-xl cell">{{sizexl}}</div>
... ...
... ... @@ -68,10 +68,18 @@ SHOE BQT KEN BLOCK',
)
)
),
'goodsDiscount'=>'【summer final sale】满¥499立享6.8折',
'goodsDiscount'=>array(
'list'=>array(
'【summer final sale】满¥499立享6.8折',
'【BACK TO SCHOOL】满¥499赠送Paul
Franke帽子一个,多买多送!',
'【BACK TO SCHOOL】满¥499赠送Paul
Franke帽子一个,多买多送!'
)
),
'feedbacks'=>array(
'commentsNum'=>0,
'consultsNum'=>0,
'consultsNum'=>1,
'nodata' =>0,
'commentName'=>'商品评价',
'consultName' =>'购买咨询',
... ...