fe / yohobuywap-node · Commits

Go to a project

Authored by 陈峰
Commit 871b4c6842e82416c12cf5a3f0beaa9642c09151 1 parent b1221975

优化经典店铺滚动各个元素的交互

Inline Side-by-side
Showing 3 changed files with 114 additions and 95 deletions
'use strict';
const fs = require('fs');
let devHost = '172.16.9.195';
let devHost = '127.0.0.1';
fs.readFile('.devhost', (err, buf)=> {
if (!err) {
... ...
... ... @@ -124,6 +124,8 @@ var defaultOpt = require('../common/query-param');
// 切换active状态到$pre上
$pre.addClass('active');
$('#pos-list').addClass('hide')
$pre.siblings('.filter').removeClass('active');
subNavScrollTo();
}
... ... @@ -706,6 +708,7 @@ $newList.on('touchstart', 'li', function(e) {
}
$newList.addClass('hide');
$('#pos-list').addClass('hide')
$firstLiDom.find('.nav-txt').text($(this).text());
$firstLiDom.attr('data-bp-id', bpIdData).addClass('active').siblings().removeClass('active');
$subNav.find('.first-li-more').removeClass('new default sale').addClass(cls);
... ... @@ -800,120 +803,133 @@ $subNav.on('touchend touchcancel', function(e) {
$newList.find('li.sale').addClass('active').siblings().removeClass('active');
}
newListHide();
return true;
}
} else {
// 最新li 列表
$newList.addClass('hide');
// 最新li 列表
$newList.addClass('hide');
if ($this.hasClass('filter')) {
// 筛选面板切换状态
if ($this.hasClass('active') && !$('.filter-mask').hasClass('hide')) {
$('.home-sub-nav>li.filter').removeClass('active');
$this.removeClass('active');
filter.hideFilter();
} else {
$('.home-sub-nav>li.filter').addClass('active');
$this.addClass('active');
if ($this.hasClass('filter')) {
filter.showFilter();
// 筛选面板切换状态
if ($this.hasClass('active') && !$('.filter-mask').hasClass('hide')) {
$('.home-sub-nav>li.filter').removeClass('active');
$this.removeClass('active');
filter.hideFilter();
if ($('#list-nav').offset().top > $(document).scrollTop()) {
$('#pos-list').addClass('hide');
}
if ($this.closest('.pos-list').length > 0) {
$('.filter-mask').addClass('call-by-fix').css('top', '');
} else {
$('.filter-mask').removeClass('call-by-fix').css('top', $this.offset().top + nav1H);
}
if ($('#pos-list').hasClass('hide')) {
$('#pos-list').removeClass('hide');
}
}
} else {
$('.home-sub-nav>li.filter').addClass('active');
$this.addClass('active');
filter.showFilter();
filter.hideFilter();// 隐藏面板
if ($this.closest('.pos-list').length > 0) {
$('.filter-mask').addClass('call-by-fix').css('top', '');
} else {
$('.filter-mask').removeClass('call-by-fix').css('top', $this.offset().top + nav1H);
}
if ($('#pos-list').hasClass('hide')) {
$('#pos-list').removeClass('hide');
if ($this.hasClass('new')) {
cname = '.new';
navType = 'newest';
} else if ($this.hasClass('price')) {
cname = '.price';
navType = 'price';
} else if ($this.hasClass('discount')) {
cname = '.discount';
navType = 'discount';
} else if ($this.hasClass('default')) {
cname = '.default';
navType = 'default';
}
}
} else {
filter.hideFilter();// 隐藏面板
if ($this.hasClass('new')) {
cname = '.new';
navType = 'newest';
} else if ($this.hasClass('price')) {
cname = '.price';
navType = 'price';
} else if ($this.hasClass('discount')) {
cname = '.discount';
navType = 'discount';
} else if ($this.hasClass('default')) {
cname = '.default';
navType = 'default';
}
nav = navInfo[navType];
var reloadCb = function() {
$goodsContainer.children('.container:not(.hide)').addClass('hide');
switch (navType) {
case 'newest':
$ngc.removeClass('hide');
break;
nav = navInfo[navType];
var reloadCb = function() {
$goodsContainer.children('.container:not(.hide)').addClass('hide');
switch (navType) {
case 'newest':
$ngc.removeClass('hide');
break;
case 'price':
$pgc.removeClass('hide');
break;
case 'discount':
$dgc.removeClass('hide');
break;
case 'default':
$defaultgc.removeClass('hide');
break;
default:
break;
}
};
case 'price':
$pgc.removeClass('hide');
break;
if ($this.hasClass('active')) {
case 'discount':
$dgc.removeClass('hide');
break;
case 'default':
$defaultgc.removeClass('hide');
break;
default:
break;
}
};
// 最新无排序切换
if ($this.hasClass('new')) {
return;
}
if ($this.hasClass('active')) {
if ($this.hasClass('price') || $this.hasClass('discount')) {
$this = $subNav.find(cname);
// 最新无排序切换
if ($this.hasClass('new')) {
return;
}
// 价格/折扣切换排序状态
$this.find('.icon > .iconfont').toggleClass('cur');
nav.reload = true; // 重置reload,HTML会被替换为逆序的HTML
nav.order = nav.order === 0 ? 1 : 0; // 切换排序
if ($this.hasClass('price') || $this.hasClass('discount')) {
$this = $subNav.find(cname);
}
} else {
$active = $subNav.find('.active');
// 价格/折扣切换排序状态
$this.find('.icon > .iconfont').toggleClass('cur');
nav.reload = true; // 重置reload,HTML会被替换为逆序的HTML
nav.order = nav.order === 0 ? 1 : 0; // 切换排序
if ($active.hasClass('filter')) {
// 若之前active项为筛选，则隐藏筛选面板
filter.hideFilter();
}
$subNav.children().removeClass('active');
$subNav.find(cname).addClass('active');
}
} else {
$active = $subNav.find('.active');
if ($active.hasClass('filter')) {
// 若之前active项为筛选，则隐藏筛选面板
filter.hideFilter();
if (!$('#pos-list').hasClass('hide')) {
subNavScrollTo();
}
if (nav.reload) {
search({
type: 'shop_id',
id: shopId,
brand: brand,
appVersion: appVersion,
url: '/product/search/search',
nextPage: false
}, reloadCb);
}
$subNav.children().removeClass('active');
$subNav.find(cname).addClass('active');
}
if (!$('#pos-list').hasClass('hide')) {
subNavScrollTo();
}
if (nav.reload) {
search({
type: 'shop_id',
id: shopId,
brand: brand,
appVersion: appVersion,
url: '/product/search/search',
nextPage: false
}, reloadCb);
}
if ($('#list-nav').offset().top > $(document).scrollTop() && $('.filter-mask').hasClass('hide')) {
if ($this.hasClass('first-li-more') && !$('#pos-list').hasClass('hide')) {
if ($('.new-list').hasClass('hide')) {
$('.new-list').removeClass('full-height');
$('#pos-list').addClass('hide');
} else {
$('.new-list').addClass('full-height');
}
} else {
$('#pos-list').addClass('hide');
}
} else if ($('#pos-list').hasClass('hide')) {
$('.new-list').removeClass('full-height');
}
e.stopPropagation();
});
... ...
... ... @@ -631,6 +631,9 @@
top: 81px;
left: 0px;
}
&.full-height {
height: 100%;
}
li {
margin-left: 35px;
height: 88px;
... ...