...
|
...
|
@@ -11,8 +11,7 @@ var $ = require('jquery'), |
|
|
|
|
|
var $authorIntro = $('.author .intro');
|
|
|
|
|
|
var isEzinPage = false,
|
|
|
isIphone = navigator.userAgent.indexOf('iPhone') > 0 ? true : false;
|
|
|
var pageInIscroll = false;
|
|
|
|
|
|
var hasCollocationBlock = $('.collocation-block').length > 0 ? true : false;
|
|
|
|
...
|
...
|
@@ -42,7 +41,7 @@ function posCollocationArrow($curCo) { |
|
|
backgroundPosition: bgPos + ' bottom'
|
|
|
});
|
|
|
|
|
|
if (isIphone && !isEzinPage) {
|
|
|
if (pageInIscroll) {
|
|
|
$fixedThumbContainer.css({
|
|
|
backgroundPosition: bgPos + ' bottom'
|
|
|
});
|
...
|
...
|
@@ -62,7 +61,7 @@ function thumbTouchEvt(e) { |
|
|
|
|
|
$thumbs.filter('.focus').removeClass('focus');
|
|
|
|
|
|
if (isIphone && !isEzinPage) {
|
|
|
if (pageInIscroll) {
|
|
|
if ($curCo.closest('.fixed-thumb-container').length > 0) {
|
|
|
$brother = $thumbContainer;
|
|
|
} else {
|
...
|
...
|
@@ -86,7 +85,7 @@ function thumbTouchEvt(e) { |
|
|
//
|
|
|
lazyLoad($curProds.find('.lazy'));
|
|
|
|
|
|
if (isIphone && !isEzinPage) {
|
|
|
if (pageInIscroll) {
|
|
|
if (myScroll) {
|
|
|
myScroll.scrollToElement(scrollToEl, 400);
|
|
|
}
|
...
|
...
|
@@ -99,76 +98,17 @@ function thumbTouchEvt(e) { |
|
|
myScroll && myScroll.refresh();
|
|
|
}
|
|
|
|
|
|
if (isIphone && !isEzinPage) {
|
|
|
if ($('.yoho-header').length > 0) {
|
|
|
$('#wrapper').addClass('ios has-head');
|
|
|
} else {
|
|
|
$('#wrapper').addClass('ios');
|
|
|
}
|
|
|
}
|
|
|
|
|
|
ellipsis.init();
|
|
|
|
|
|
lazyLoad($('.lazy'));
|
|
|
|
|
|
//title mlellipsis
|
|
|
$('.info-list .title, .one-good .reco-name').each(function() {
|
|
|
this.mlellipsis(2);
|
|
|
});
|
|
|
|
|
|
//offset.left约等于marginLeft的值则表示介绍被换行,则清除intro的paddingTop让其更靠近头像和作者名
|
|
|
if ($authorIntro.offset() && (parseInt($authorIntro.offset().left, 10) ===
|
|
|
parseInt($authorIntro.css('margin-left'), 10))) {
|
|
|
$authorIntro.css('padding-top', 0);
|
|
|
}
|
|
|
|
|
|
//有搭配模块,iphone使用iscroll初始化滚动并有固定的搭配栏,其他的没有
|
|
|
if (hasCollocationBlock) {
|
|
|
$coBlock = $('.collocation-block');
|
|
|
$thumbContainer = $coBlock.children('.thumb-container');
|
|
|
$thumbs = $thumbContainer.find('li');
|
|
|
$prods = $coBlock.find('.prod');
|
|
|
|
|
|
thumbWidth = $thumbs.width();
|
|
|
|
|
|
if (isIphone) {
|
|
|
$fixedThumbContainer = $('#wrapper')
|
|
|
.after($thumbContainer.clone().addClass('fixed-thumb-container fixed-bottom'))
|
|
|
.next('.thumb-container');
|
|
|
|
|
|
//load img of fixed thumb container
|
|
|
lazyLoad($fixedThumbContainer.find('.lazy'), {
|
|
|
event: 'sporty'
|
|
|
});
|
|
|
}
|
|
|
|
|
|
//Init Arrow Position
|
|
|
posCollocationArrow($thumbs.filter('.focus'));
|
|
|
|
|
|
$thumbContainer.delegate('.thumb', 'touchend', thumbTouchEvt);
|
|
|
|
|
|
if (isIphone && !isEzinPage) {
|
|
|
$fixedThumbContainer.delegate('.thumb', 'touchend', thumbTouchEvt);
|
|
|
}
|
|
|
}
|
|
|
|
|
|
/**
|
|
|
* 初始化页面参数
|
|
|
*/
|
|
|
exports.init = function(flag) {
|
|
|
if (flag === true) {
|
|
|
isEzinPage = true;
|
|
|
}
|
|
|
};
|
|
|
|
|
|
// 初始化iscroll
|
|
|
window.onload = function() {
|
|
|
var $scroller = $('#scroller');
|
|
|
function initIscroll() {
|
|
|
var $scroller = $('#scroller'),
|
|
|
$yohoHeader = $('.yoho-header');
|
|
|
|
|
|
var winH, tcH, cbH, cbTop, fixedThumbDom;
|
|
|
var hH = 0,
|
|
|
winH, tcH, cbH, cbTop, fixedThumbDom;
|
|
|
|
|
|
if (!isIphone || isEzinPage) {
|
|
|
return;
|
|
|
//考虑通用头部的影响:对offset().top以及winH做对应偏移
|
|
|
if ($yohoHeader.length > 0) {
|
|
|
hH = $yohoHeader.outerHeight();
|
|
|
}
|
|
|
|
|
|
myScroll = new IScroll('#wrapper', {
|
...
|
...
|
@@ -188,12 +128,12 @@ window.onload = function() { |
|
|
return;
|
|
|
}
|
|
|
|
|
|
winH = $(window).height();
|
|
|
winH = $(window).height() - hH;
|
|
|
fixedThumbDom = $fixedThumbContainer[0];
|
|
|
|
|
|
tcH = $thumbContainer.height();
|
|
|
cbH = $coBlock.height();
|
|
|
cbTop = $coBlock.offset().top;
|
|
|
tcH = $thumbContainer.outerHeight();
|
|
|
cbH = $coBlock.outerHeight();
|
|
|
cbTop = $coBlock.offset().top - hH;
|
|
|
|
|
|
myScroll.on('scroll', function() {
|
|
|
var sTop = -this.y;
|
...
|
...
|
@@ -224,7 +164,7 @@ window.onload = function() { |
|
|
.addClass('absolute')
|
|
|
.removeClass('fixed-top hide');
|
|
|
}
|
|
|
fixedThumbDom.style.top = cbTop + cbH - tcH - sTop + 'px';
|
|
|
fixedThumbDom.style.top = cbTop + hH + cbH - tcH - sTop + 'px';
|
|
|
} else if (sTop > cbTop + cbH) {
|
|
|
if (classList.indexOf('hide') === -1) {
|
|
|
$fixedThumbContainer
|
...
|
...
|
@@ -234,4 +174,75 @@ window.onload = function() { |
|
|
}
|
|
|
$scroller.trigger('scroll');
|
|
|
});
|
|
|
}
|
|
|
|
|
|
//window onload 后重新refresh iscroll
|
|
|
window.onload = function() {
|
|
|
myScroll && myScroll.refresh();
|
|
|
};
|
|
|
|
|
|
//初始化页面,包括是否使用iscorll初始化页面
|
|
|
//接口暴露在HTML中,使用压缩名
|
|
|
exports.i = function(useIscroll) {
|
|
|
var isIphone = navigator.userAgent.indexOf('iPhone') > 0 ? true : false;
|
|
|
|
|
|
pageInIscroll = isIphone && useIscroll;
|
|
|
|
|
|
ellipsis.init();
|
|
|
|
|
|
lazyLoad($('.lazy'));
|
|
|
|
|
|
//title mlellipsis
|
|
|
$('.info-list .title, .one-good .reco-name').each(function() {
|
|
|
this.mlellipsis(2);
|
|
|
});
|
|
|
|
|
|
//offset.left约等于marginLeft的值则表示介绍被换行,则清除intro的paddingTop让其更靠近头像和作者名
|
|
|
if ($authorIntro.offset() && (parseInt($authorIntro.offset().left, 10) ===
|
|
|
parseInt($authorIntro.css('margin-left'), 10))) {
|
|
|
$authorIntro.css('padding-top', 0);
|
|
|
}
|
|
|
|
|
|
if (pageInIscroll) {
|
|
|
if ($('.yoho-header').length > 0) {
|
|
|
$('#wrapper').addClass('ios has-head');
|
|
|
} else {
|
|
|
$('#wrapper').addClass('ios');
|
|
|
}
|
|
|
}
|
|
|
|
|
|
//有搭配模块,iphone使用iscroll初始化滚动并有固定的搭配栏,其他的没有
|
|
|
if (hasCollocationBlock) {
|
|
|
$coBlock = $('.collocation-block');
|
|
|
$thumbContainer = $coBlock.children('.thumb-container');
|
|
|
$thumbs = $thumbContainer.find('li');
|
|
|
$prods = $coBlock.find('.prod');
|
|
|
|
|
|
thumbWidth = $thumbs.width();
|
|
|
|
|
|
if (pageInIscroll) {
|
|
|
$fixedThumbContainer = $('#wrapper')
|
|
|
.after($thumbContainer.clone().addClass('fixed-thumb-container fixed-bottom'))
|
|
|
.next('.thumb-container');
|
|
|
|
|
|
//load img of fixed thumb container
|
|
|
lazyLoad($fixedThumbContainer.find('.lazy'), {
|
|
|
event: 'sporty'
|
|
|
});
|
|
|
}
|
|
|
|
|
|
//Init Arrow Position
|
|
|
posCollocationArrow($thumbs.filter('.focus'));
|
|
|
|
|
|
$thumbContainer.delegate('.thumb', 'touchend', thumbTouchEvt);
|
|
|
|
|
|
if (pageInIscroll) {
|
|
|
$fixedThumbContainer.delegate('.thumb', 'touchend', thumbTouchEvt);
|
|
|
|
|
|
}
|
|
|
}
|
|
|
|
|
|
if (pageInIscroll) {
|
|
|
initIscroll();
|
|
|
}
|
|
|
}; |
|
|
\ No newline at end of file |
...
|
...
|
|