|
...
|
...
|
@@ -20,6 +20,8 @@ var $main = $('.main'), |
|
|
|
id = $main.data('id'),
|
|
|
|
md5 = $main.data('md5'),
|
|
|
|
skn = $main.data('skn'),
|
|
|
|
size = $main.data('size'),
|
|
|
|
num = $main.data('num'),
|
|
|
|
deposit = $main.data('deposit') === 'Y',
|
|
|
|
secKill = $main.data('seckill') === 'Y';
|
|
|
|
|
|
...
|
...
|
@@ -33,6 +35,10 @@ var colTxt = { |
|
|
|
|
|
|
|
var $saleReturn = $('#saleReturn');
|
|
|
|
|
|
|
|
require('yoho-slider');
|
|
|
|
require('../plugins/slider');
|
|
|
|
require('../common/center-slider');
|
|
|
|
|
|
|
|
bindEvent.add(function() {
|
|
|
|
var $imgShow = $('#img-show'),
|
|
|
|
$thumbs = $('#thumbs > .thumb-wrap');
|
|
...
|
...
|
@@ -788,6 +794,287 @@ function fetchComment() { |
|
|
|
|
|
|
|
window.fetchComment = fetchComment;
|
|
|
|
|
|
|
|
// 店铺推荐
|
|
|
|
function loadRecommend() {
|
|
|
|
$.ajax({
|
|
|
|
type: 'GET',
|
|
|
|
url: '/product/detail/recommend',
|
|
|
|
data: {
|
|
|
|
skn: skn,
|
|
|
|
size: 20,
|
|
|
|
num: 1
|
|
|
|
}
|
|
|
|
}).then(function(data) {
|
|
|
|
var res;
|
|
|
|
|
|
|
|
if (data.code === 200) {
|
|
|
|
res = data.data;
|
|
|
|
|
|
|
|
if (res.length === 0) {
|
|
|
|
$('.individual-comment .block-title>.title ').next('.sep').addClass('hide').next('.title').addClass('hide');
|
|
|
|
return;
|
|
|
|
}
|
|
|
|
|
|
|
|
var tpl = Handlebars.compile($('#recommend-shop').html());
|
|
|
|
|
|
|
|
console.log($('#recommend-shop').html());
|
|
|
|
var html = tpl(data.data);
|
|
|
|
console.log(html);
|
|
|
|
// console.log(res);
|
|
|
|
|
|
|
|
}
|
|
|
|
});
|
|
|
|
}
|
|
|
|
// window.loadRecommend = loadRecommend;
|
|
|
|
|
|
|
|
loadRecommend();
|
|
|
|
// 推荐和浏览切换
|
|
|
|
$('.individual-comment').on('click', '.title', function() {
|
|
|
|
var $this = $(this),
|
|
|
|
index = $this.index();
|
|
|
|
|
|
|
|
var $latestWalk = $('.latest-walk'),
|
|
|
|
$recommendComment = $('.recommend-comment');
|
|
|
|
|
|
|
|
if ($this.hasClass('cur')) {
|
|
|
|
return;
|
|
|
|
}
|
|
|
|
|
|
|
|
$this.addClass('cur');
|
|
|
|
$this.siblings('.cur').removeClass('cur');
|
|
|
|
|
|
|
|
if (index === 0) {
|
|
|
|
|
|
|
|
// 浏览
|
|
|
|
$recommendComment.slideDown(SLIDETIME);
|
|
|
|
$latestWalk.slideUp(SLIDETIME);
|
|
|
|
} else {
|
|
|
|
$recommendComment.slideUp(SLIDETIME);
|
|
|
|
$latestWalk.slideDown(SLIDETIME);
|
|
|
|
}
|
|
|
|
});
|
|
|
|
// 轮播
|
|
|
|
(function($) {
|
|
|
|
$('.recommend-slider').unslider({
|
|
|
|
arrows:true,
|
|
|
|
nav: false,
|
|
|
|
infinite: true,
|
|
|
|
animate: 'fade',
|
|
|
|
loop: false
|
|
|
|
});
|
|
|
|
$.fn.slider3 = function(options) {
|
|
|
|
var timer,
|
|
|
|
$imgList = $(this).find('.recommend-slider ul'),
|
|
|
|
$imgItem = $(this).find('.recommend-slider li'),
|
|
|
|
$switch = $(this).find('.recommend-slider .unslider-wrap');
|
|
|
|
|
|
|
|
var $prevswitch = $switch.find('.prev'),
|
|
|
|
$nextswitch = $switch.find('.next');
|
|
|
|
|
|
|
|
$.fn.slider3.defaults = {
|
|
|
|
index: 0,
|
|
|
|
shownum: 5,
|
|
|
|
autoplay: false,
|
|
|
|
delaytime: 3000,
|
|
|
|
isCircle: true
|
|
|
|
};
|
|
|
|
|
|
|
|
var shownum = options.shownum ? options.shownum : // eslint-disable-line
|
|
|
|
$.fn.slider3.defaults.shownum;
|
|
|
|
|
|
|
|
var isCircle = 'isCircle' in options ? options.isCircle : // eslint-disable-line
|
|
|
|
$.fn.slider3.defaults.isCircle;
|
|
|
|
|
|
|
|
function autoplayrecycle(index, limit, toright) {
|
|
|
|
window.setTimeout(autoplay, $.fn.slider3.defaults.delaytime, index, limit, toright);// eslint-disable-line
|
|
|
|
}
|
|
|
|
|
|
|
|
function autoplay(index, limit, toright) {
|
|
|
|
if (toright === true) {
|
|
|
|
$nextswitch.trigger('click');
|
|
|
|
if (index === (limit - shownum)) {
|
|
|
|
autoplayrecycle(--index, limit, false);
|
|
|
|
} else {
|
|
|
|
autoplayrecycle(++index, limit, true);
|
|
|
|
}
|
|
|
|
} else {
|
|
|
|
$prevswitch.trigger('click');
|
|
|
|
if (index === 0) {
|
|
|
|
autoplayrecycle(++index, limit, true);
|
|
|
|
} else {
|
|
|
|
autoplayrecycle(--index, limit, false);
|
|
|
|
}
|
|
|
|
}
|
|
|
|
}
|
|
|
|
|
|
|
|
function autoClickNext() {
|
|
|
|
var delaytime = 'delaytime' in options ? options.delaytime :
|
|
|
|
$.fn.slider3.defaults.delaytime;
|
|
|
|
|
|
|
|
timer = setInterval(function() {
|
|
|
|
$nextswitch.click();
|
|
|
|
}, delaytime);
|
|
|
|
}
|
|
|
|
|
|
|
|
function changePic(index, width, callback) {
|
|
|
|
var offersetleft = -(index * width);
|
|
|
|
|
|
|
|
$imgList
|
|
|
|
.animate({
|
|
|
|
'margin-left': offersetleft + 'px'
|
|
|
|
}, 'slow', callback);
|
|
|
|
|
|
|
|
}
|
|
|
|
|
|
|
|
/**
|
|
|
|
* 不轮播左右切换
|
|
|
|
* @param $items 图片dom
|
|
|
|
* @param shownum 展示张数
|
|
|
|
* @param direction 0=左箭头， 1=右箭头
|
|
|
|
* @param $switch 按钮
|
|
|
|
*/
|
|
|
|
function changeMarLeft(wItem, num, direction, $arrow) {
|
|
|
|
// 处理双击问题
|
|
|
|
var disableSwitch = $arrow.data('disable') ? true : false;
|
|
|
|
|
|
|
|
var offersetleft = num * wItem;
|
|
|
|
var w = parseInt($imgList.css('width'), 10);
|
|
|
|
var ml = $imgList.css('margin-left') === '0px' ? 0 : parseInt($imgList.css('margin-left'), 10);
|
|
|
|
var gap = ml + offersetleft > wItem ? 0 : ml + offersetleft;
|
|
|
|
var mo = direction === 0 ? gap : ml - offersetleft;
|
|
|
|
var flag = direction === 0 ? ml < 0 : (w - (-ml) - offersetleft) >= wItem;
|
|
|
|
|
|
|
|
if (disableSwitch) {
|
|
|
|
return;
|
|
|
|
}
|
|
|
|
|
|
|
|
$prevswitch.data('disable', true);
|
|
|
|
$nextswitch.data('disable', true);
|
|
|
|
|
|
|
|
if (flag) {
|
|
|
|
$imgList
|
|
|
|
.animate({
|
|
|
|
'margin-left': mo + 'px'
|
|
|
|
}, 'slow', function() {
|
|
|
|
$prevswitch.data('disable', false);
|
|
|
|
$nextswitch.data('disable', false);
|
|
|
|
});
|
|
|
|
} else {
|
|
|
|
$prevswitch.data('disable', false);
|
|
|
|
$nextswitch.data('disable', false);
|
|
|
|
}
|
|
|
|
}
|
|
|
|
|
|
|
|
function _slideShow() {
|
|
|
|
var $imgLazyList = $imgList.find('img.lazy'),
|
|
|
|
i = 0,
|
|
|
|
$img;
|
|
|
|
|
|
|
|
for (i; i < $imgLazyList.length; i++) {
|
|
|
|
$img = $($imgLazyList[i]);
|
|
|
|
|
|
|
|
// 未加载图片的及时显示
|
|
|
|
if ($img.attr('src') !== $img.data('original')) {
|
|
|
|
lazyLoad($img, {
|
|
|
|
event: 'sporty'
|
|
|
|
});
|
|
|
|
$img.trigger('sporty');
|
|
|
|
}
|
|
|
|
}
|
|
|
|
}
|
|
|
|
_slideShow();// 首次把所有懒加载图片，都加载了
|
|
|
|
|
|
|
|
return this.each(function() {
|
|
|
|
var opts = $.extend({}, $.fn.slider2.defaults, options);
|
|
|
|
var mr = parseInt($imgItem.css('margin-right'), 10);
|
|
|
|
var $banneritems = $imgItem;
|
|
|
|
var bannerarr = [];
|
|
|
|
var _width = $banneritems.outerWidth() + mr,
|
|
|
|
_size = $banneritems.length,
|
|
|
|
j = 0;
|
|
|
|
|
|
|
|
if (_size <= shownum) {
|
|
|
|
$switch.hide();
|
|
|
|
return;
|
|
|
|
}
|
|
|
|
for (j = 0; j < $banneritems.length; j++) {
|
|
|
|
bannerarr.push($banneritems[j]);
|
|
|
|
}
|
|
|
|
_size = bannerarr.length;
|
|
|
|
$imgList.css({
|
|
|
|
width: (_width * _size)
|
|
|
|
});
|
|
|
|
$nextswitch.on('click', function(e) {
|
|
|
|
var i = 0,
|
|
|
|
_obj = null;
|
|
|
|
|
|
|
|
e.preventDefault();
|
|
|
|
if (isCircle) {
|
|
|
|
// 循环播放
|
|
|
|
changePic(shownum, _width, function() {
|
|
|
|
for (i = 0; i < shownum; i++) {
|
|
|
|
_obj = bannerarr.shift();
|
|
|
|
|
|
|
|
$imgList.append(_obj.outerHTML);
|
|
|
|
bannerarr.push(_obj);
|
|
|
|
$imgList.find('li').first().remove();
|
|
|
|
}
|
|
|
|
$imgList.css({
|
|
|
|
'margin-left': '0'
|
|
|
|
});
|
|
|
|
});
|
|
|
|
} else {
|
|
|
|
changeMarLeft($banneritems.outerWidth() + mr, shownum, 1, $nextswitch);
|
|
|
|
}
|
|
|
|
|
|
|
|
|
|
|
|
});
|
|
|
|
$prevswitch.on('click', function(e) {
|
|
|
|
var i = 0,
|
|
|
|
_obj = null,
|
|
|
|
offersetleft = '';
|
|
|
|
|
|
|
|
e.preventDefault();
|
|
|
|
if (isCircle) {
|
|
|
|
for (i = 0; i < shownum; i++) {
|
|
|
|
_obj = bannerarr.pop();
|
|
|
|
|
|
|
|
$imgList.prepend(_obj.outerHTML);
|
|
|
|
bannerarr.unshift(_obj);
|
|
|
|
$imgList.find('li').last().remove();
|
|
|
|
}
|
|
|
|
offersetleft = shownum * _width;
|
|
|
|
$imgList.css({
|
|
|
|
'margin-left': -offersetleft + 'px'
|
|
|
|
});
|
|
|
|
changePic(0, _width);
|
|
|
|
} else {
|
|
|
|
changeMarLeft($banneritems.outerWidth() + mr, shownum, 0, $prevswitch);
|
|
|
|
}
|
|
|
|
});
|
|
|
|
if (opts.autoplay === true) {
|
|
|
|
autoClickNext($(this));
|
|
|
|
$(this).hover(function() {
|
|
|
|
clearInterval(timer);
|
|
|
|
}, function() {
|
|
|
|
autoClickNext($(this));
|
|
|
|
});
|
|
|
|
}
|
|
|
|
});
|
|
|
|
|
|
|
|
};
|
|
|
|
$('.recommend-slider').slider3({
|
|
|
|
shownum: 5,
|
|
|
|
orient: true,
|
|
|
|
isCircle: false
|
|
|
|
});
|
|
|
|
$('.recommend-slider .unslider-arrow').mouseenter(function(){
|
|
|
|
$(this).addClass('focus');
|
|
|
|
}).mouseleave(function(){
|
|
|
|
$(this).removeClass('focus');
|
|
|
|
});
|
|
|
|
}($));
|
|
|
|
|
|
|
|
// 特殊商品退换货
|
|
|
|
function fetchReturn() {
|
|
|
|
return $.ajax({
|
...
|
...
|
|
