fe / yoho-blk · Commits

Go to a project

Authored by zhangxiaoru
Commit 8a95f3f867786b10b2ef5483026a2bdae417007f 1 parent 262491bc

editorial

Inline Side-by-side
Showing 3 changed files with 85 additions and 29 deletions
... ... @@ -69,14 +69,16 @@
</div>
</div>
</div>
<div class="related-goods goods">
{{# relatedGroup}}
{{> related-goods}}
{{/ relatedGroup}}
<span class="left iconfont">&#xe62c;</span>
<span class="right iconfont">&#xe629;</span>
<div class="related-groups">
<div class="related-goods goods">
{{# relatedGroup}}
{{> related-goods}}
{{/ relatedGroup}}
</div>
</div>
<span class="left iconfont hide">&#xe62c;</span>
<span class="right iconfont">&#xe629;</span>
</div>
{{/ related}}
{{/ content}}
... ... @@ -107,22 +109,22 @@
</div>
{{# userInfo}}
<div class="user-handle">
<ul class="clearfix">
<li id="prise-btn" class="like-status{{# isLike}} liked{{/ isLike}}">
<a href="javascript:;">
<i class="iconfont">&#xe60e;</i>
<span class="like-num">{{likeNum}}</span>
</a>
</li>
<li id="collect-btn" class="sort-collect{{# isCollected}} collected{{/ isCollected}}">
<a href="javascript:;">
<i class="iconfont">&#xe619;</i>
<span>收藏</span>
</a>
</li>
</ul>
</div>
<div class="user-handle">
<ul class="clearfix">
<li id="prise-btn" class="like-status{{# isLike}} liked{{/ isLike}}">
<a href="javascript:;">
<i class="iconfont">&#xe60e;</i>
<span class="like-num">{{likeNum}}</span>
</a>
</li>
<li id="collect-btn" class="sort-collect{{# isCollected}} collected{{/ isCollected}}">
<a href="javascript:;">
<i class="iconfont">&#xe619;</i>
<span>收藏</span>
</a>
</li>
</ul>
</div>
{{/ userInfo}}
{{> share}}
... ...
... ... @@ -17,9 +17,12 @@ var $commentList = $commentArea.find('.comments-wrap'),
MAX_COMMENTS_WORDS = 100,
$wordCountTip = $('#word-count-tip'),
_alert = dialog.Alert,
tag = $('#tags').find('li').length;
tag = $('#tags').find('li').length,
len = $('.goods').find('.good-info').length / 4,
pag = 0;
require('../plugins/share');
//require('yoho-unslider');
$('#prise-btn').click(function() {
var prising = false,
... ... @@ -192,10 +195,35 @@ if ($('.collocation').find('.good-info').length === 0) {
if ($('.goods').find('.good-info').length === 0) {
$('.related-group').hide();
} else if ($('.goods').find('.good-info').length < 5) {
$('.left').hide();
$('.right').hide();
}
// $('.left').click(function {
// $('.goods').animate({ left: '+50px' }, "slow");
// })
$('.right').click(function() {
pag = pag + 1;
// console.log($('.goods').offsetWidth()
if (pag === len -1 ) {
$('.right').addClass('hide');
}
if (pag !== 0 ) {
$('.left').removeClass('hide');
}
$('.goods').animate({left: '+=' + '-930px'});
})
$('.left').click(function() {
pag = pag - 1;
if (pag === 0) {
$('.left').addClass('hide');
}
if(pag !== len -1) {
$('.right').removeClass('hide');
}
$(".goods").animate({left: '+=' + '930px'});
})
... ...
... ... @@ -98,6 +98,10 @@
overflow: hidden;
position: relative;
.collocation {
margin-left: 30px;
}
.btn {
position: relative;
}
... ... @@ -137,8 +141,21 @@
}
}
.related-group {
position: relative;
height: 450px;
}
.related-groups {
width: 930px;
overflow: hidden;
position: relative;
height: 420px;
margin-left: 30px;
}
.related-goods {
padding: 60px 0 0 30px;
padding-top: 60px;
.good-info {
width: 219px;
... ... @@ -173,6 +190,11 @@
.goods {
height: 420px;
overflow: hidden;
position: absolute;
.good-info:nth-child(4n) {
margin-right: 0;
}
}
.related-brand {
... ... @@ -500,4 +522,8 @@
padding-left: 30px;
width: 330px;
}
.hide {
display: none;
}
}
... ...