fe / yohobuy-node · Commits

Go to a project

Authored by 周少峰
Commit 03e44e5716de8e920cd6f4215494c45e8888e4ff 2 parents 50001ae6 e551e361

Merge branch 'feature/new-product-arrive' into 'release/5.4' 

Feature/new product arrive



See merge request !64
Inline Side-by-side
Showing 4 changed files with 132 additions and 574 deletions
... ... @@ -153,14 +153,19 @@ const index = (req) => {
yh_channel: channelMap[channel].yh_channel,
uid: req.user.uid || ''
};
let shopParams = Object.assign({}, params, {contentCode: channelMap[channel].code});
let recParams = Object.assign({}, params);
let recParams = Object.assign({}, params, {
sort: req.query.sort || '',
page: req.query.page || 1
});
let apiMethod = [
headerModel.requestHeaderData(channel),
api.recShop(shopParams),
api.recBrand(params),
api.recList(recParams)
api.recList(Object.assign({}, params)),//获取品类
api.recList(recParams)//获取商品数据
];
return Promise.all(apiMethod).then(result => {
... ... @@ -253,22 +258,32 @@ const index = (req) => {
// 推荐品类
_.forEach(groupSort, group =>{
_.forEach(group.sub, subSort =>{
let cateObj = {
cateId: subSort.category_id,
url: publicHandler.handleFilterUrl(params, {sort: subSort.relation_parameter.sort}),
name: subSort.category_name,
active: false
};
if (ctyList.length < 20) {
ctyList.push({
cateId: subSort.category_id,
url: publicHandler.handleFilterUrl(params, {sort: subSort.relation_parameter.sort}),
name: subSort.category_name
});
//默认选中判断
if (req.query.sort === subSort.relation_parameter.sort) {
cateObj.active = true;
}
ctyList.push(cateObj);
} else {
return true;
}
});
});
Object.assign(respData.newProduct.ctyList, ctyList);
}
// 最新上架
if (result[4].code === 200 && result[4].data) {
// 列表数据
Object.assign(respData.newProduct, _proListHandler(result[3].data,
Object.assign({}, recParams, {channel: channel})));
Object.assign(respData.newProduct, _proListHandler(result[4].data,
Object.assign({}, recParams, {channel: channel})));
}
// 数据为空，不显示页面模块
... ...
... ... @@ -4,7 +4,6 @@
var $ = require('yoho-jquery'),
lazyLoad = require('yoho-jquery-lazyload');
var Swiper = require('yoho-swiper');
var yas = require('../common/data-yas');
var $arriveList = $('.new-arrive-list');
var $goodInfo = $arriveList.find('.good-info');
... ... @@ -55,7 +54,7 @@ function getProListData() {
$good.find('.list-box li').each(function() {
keys.push($(this).find('a').html());
});
goodObj.KEYWORD_WORD = keys.join(',');
goodObj.KEYWORD = keys.join(',');
}
// 普通商品
... ... @@ -114,26 +113,60 @@ function fixAreaTop(scrollTop) {
});
}
}
new Swiper('.rec-swiper', {
pagination: '.swiper-pagination',
paginationClickable: true,
slidesPerView: 6,
slidesPerColumn: 2,
spaceBetween: 8,
lazyLoading: true,
nextButton: '.next',
prevButton: '.prev'
});
new Swiper('.brand-swiper', {
pagination: '.swiper-pagination',
paginationClickable: true,
slidesPerView: 6,
spaceBetween: 8,
lazyLoading: true,
nextButton: '.next',
prevButton: '.prev'
});
var SwiperSingle = {
getSwiperWidth: function ($swiper) {
var $wrap = $swiper.find('.swiper-wrapper'),
sliders = $wrap.find('.swiper-slide'),
sliderWidth = sliders.outerWidth(true);
$wrap.css('width', sliderWidth*sliders.length + 'px');
},
next: function ($swiper) {
var that = this;
var $wrap = $swiper.find('.swiper-wrapper'),
wrapWidth = $wrap.width(),
actionIndex = $wrap.attr('actionIndex') || 1,
sliders = $wrap.find('.swiper-slide'),
sliderWidth = sliders.outerWidth(true),
left = parseInt($wrap.css('margin-left'), 10);
if (!this.moving && wrapWidth - (-left) > $swiper.width() + sliderWidth) {
left = left - sliderWidth;
this.moving = true;
$wrap.animate({'margin-left': left}, function () {
that.moving = false;
});
$wrap.attr('actionIndex', ++actionIndex);
}
},
prev: function ($swiper) {
var that = this;
var $wrap = $swiper.find('.swiper-wrapper'),
actionIndex = $wrap.attr('actionIndex') || 1,
sliders = $wrap.find('.swiper-slide'),
sliderWidth = sliders.outerWidth(true),
left = parseInt($wrap.css('margin-left'), 10);
if (!this.moving && actionIndex > 1) {
left = left + sliderWidth;
this.moving = true;
$wrap.animate({'margin-left': left}, function () {
that.moving = false;
});
$wrap.attr('actionIndex', --actionIndex);
}
},
resize: function ($swiper) {
var $wrap = $swiper.find('.swiper-wrapper'),
actionIndex = $wrap.attr('actionIndex') || 1,
sliders = $wrap.find('.swiper-slide'),
sliderWidth = sliders.outerWidth(true),
left = (actionIndex-1) * sliderWidth;
$wrap.css('margin-left', left);
}
}
lazyLoad($('img.lazy'));
... ... @@ -196,18 +229,33 @@ $('#new-product-floor').on('click', '.catagory-navs li', function() {
$(function() {
// 轮播数量不够隐藏左右箭头
var $recSwiper = $('#rec-swiper'),
recNum = $recSwiper.find('.swiper-wrapper > .swiper-slide').length,
$brandSwiper = $('#brand-swiper'),
recNum = $recSwiper.find('.swiper-wrapper > .swiper-slide').length,
brandNum = $brandSwiper.find('.swiper-wrapper > .swiper-slide').length;
if (recNum <= 12) {
if (recNum <= 6) {
$recSwiper.find('.prev,.next').addClass('hide');
}
if (brandNum <= 6) {
$brandSwiper.find('.prev,.next').addClass('hide');
}
SwiperSingle.getSwiperWidth($('#rec-swiper'));//初始化宽度
SwiperSingle.getSwiperWidth($('#brand-swiper'));//初始化宽度
$('.next').on('click', function () {
SwiperSingle.next($(this).parent());
});
$('.prev').on('click', function () {
SwiperSingle.prev($(this).parent());
});
$(window).resize(function() {
SwiperSingle.getSwiperWidth($('#rec-swiper'));//初始化宽度
SwiperSingle.getSwiperWidth($('#brand-swiper'));//初始化宽度
});
fixAreaTop($(this).scrollTop());
});
... ... @@ -442,7 +490,7 @@ $(function() {
// 热门搜索
if (recType === 'hotSearchTerm') {
goodData.KEYWORD_WORD = $(this).html();
goodData.KEYWORD = $(this).html();
}
$.extend(goodData, getProData($good));
yas.givePoint('YB_NEW_ARRIVAL_FLR_C', goodData);
... ...
/**
* Swiper 3.3.1
* Most modern mobile touch slider and framework with hardware accelerated transitions
*
* http://www.idangero.us/swiper/
*
* Copyright 2016, Vladimir Kharlampidi
* The iDangero.us
* http://www.idangero.us/
*
* Licensed under MIT
*
* Released on: February 7, 2016
*/
.swiper-container {
margin: 0 auto;
position: relative;
overflow: hidden;
/* Fix of Webkit flickering */
z-index: 1;
}
.swiper-container-no-flexbox .swiper-slide {
float: left;
}
.swiper-container-vertical > .swiper-wrapper {
-webkit-box-orient: vertical;
-moz-box-orient: vertical;
-ms-flex-direction: column;
-webkit-flex-direction: column;
flex-direction: column;
}
.swiper-wrapper {
position: relative;
width: 100%;
height: 100%;
z-index: 1;
display: -webkit-box;
display: -moz-box;
display: -ms-flexbox;
display: -webkit-flex;
display: flex;
-webkit-transition-property: -webkit-transform;
-moz-transition-property: -moz-transform;
-o-transition-property: -o-transform;
-ms-transition-property: -ms-transform;
transition-property: transform;
-webkit-box-sizing: content-box;
-moz-box-sizing: content-box;
box-sizing: content-box;
}
.swiper-container-android .swiper-slide,
.swiper-wrapper {
-webkit-transform: translate3d(0px, 0, 0);
-moz-transform: translate3d(0px, 0, 0);
-o-transform: translate(0px, 0px);
-ms-transform: translate3d(0px, 0, 0);
transform: translate3d(0px, 0, 0);
}
.swiper-container-multirow > .swiper-wrapper {
-webkit-box-lines: multiple;
-moz-box-lines: multiple;
-ms-flex-wrap: wrap;
-webkit-flex-wrap: wrap;
flex-wrap: wrap;
}
.swiper-container-free-mode > .swiper-wrapper {
-webkit-transition-timing-function: ease-out;
-moz-transition-timing-function: ease-out;
-ms-transition-timing-function: ease-out;
-o-transition-timing-function: ease-out;
transition-timing-function: ease-out;
margin: 0 auto;
position: relative;
overflow: hidden;
}
.swiper-slide {
-webkit-flex-shrink: 0;
-ms-flex: 0 0 auto;
flex-shrink: 0;
width: 100%;
height: 100%;
position: relative;
}
/* Auto Height */
.swiper-container-autoheight,
.swiper-container-autoheight .swiper-slide {
height: auto;
}
.swiper-container-autoheight .swiper-wrapper {
-webkit-box-align: start;
-ms-flex-align: start;
-webkit-align-items: flex-start;
align-items: flex-start;
-webkit-transition-property: -webkit-transform, height;
-moz-transition-property: -moz-transform;
-o-transition-property: -o-transform;
-ms-transition-property: -ms-transform;
transition-property: transform, height;
}
/* a11y */
.swiper-container .swiper-notification {
position: absolute;
left: 0;
top: 0;
pointer-events: none;
opacity: 0;
z-index: -1000;
}
/* IE10 Windows Phone 8 Fixes */
.swiper-wp8-horizontal {
-ms-touch-action: pan-y;
touch-action: pan-y;
}
.swiper-wp8-vertical {
-ms-touch-action: pan-x;
touch-action: pan-x;
}
/* Arrows */
.swiper-button-prev,
.swiper-button-next {
position: absolute;
top: 50%;
width: 27px;
height: 44px;
margin-top: -22px;
z-index: 10;
cursor: pointer;
-moz-background-size: 27px 44px;
-webkit-background-size: 27px 44px;
background-size: 27px 44px;
background-position: center;
background-repeat: no-repeat;
}
.swiper-button-prev.swiper-button-disabled,
.swiper-button-next.swiper-button-disabled {
opacity: 0.35;
cursor: auto;
pointer-events: none;
}
.swiper-button-prev,
.swiper-container-rtl .swiper-button-next {
left: 10px;
right: auto;
}
.swiper-button-prev.swiper-button-black,
.swiper-container-rtl .swiper-button-next.swiper-button-black {
}
.swiper-button-prev.swiper-button-white,
.swiper-container-rtl .swiper-button-next.swiper-button-white {
}
.swiper-button-next,
.swiper-container-rtl .swiper-button-prev {
right: 10px;
left: auto;
}
.swiper-button-next.swiper-button-black,
.swiper-container-rtl .swiper-button-prev.swiper-button-black {
}
.swiper-button-next.swiper-button-white,
.swiper-container-rtl .swiper-button-prev.swiper-button-white {
}
/* Pagination Styles */
.swiper-pagination {
position: absolute;
text-align: center;
-webkit-transition: 300ms;
-moz-transition: 300ms;
-o-transition: 300ms;
transition: 300ms;
-webkit-transform: translate3d(0, 0, 0);
-ms-transform: translate3d(0, 0, 0);
-o-transform: translate3d(0, 0, 0);
transform: translate3d(0, 0, 0);
z-index: 10;
}
.swiper-pagination.swiper-pagination-hidden {
opacity: 0;
}
/* Common Styles */
.swiper-pagination-fraction,
.swiper-pagination-custom,
.swiper-container-horizontal > .swiper-pagination-bullets {
bottom: 10px;
left: 0;
width: 100%;
}
/* Bullets */
.swiper-pagination-bullet {
width: 8px;
height: 8px;
display: inline-block;
border-radius: 100%;
background: #000;
opacity: 0.2;
}
button.swiper-pagination-bullet {
border: none;
margin: 0;
padding: 0;
box-shadow: none;
-moz-appearance: none;
-ms-appearance: none;
-webkit-appearance: none;
appearance: none;
}
.swiper-pagination-clickable .swiper-pagination-bullet {
cursor: pointer;
}
.swiper-pagination-white .swiper-pagination-bullet {
background: #fff;
}
.swiper-pagination-bullet-active {
opacity: 1;
background: #007aff;
}
.swiper-pagination-white .swiper-pagination-bullet-active {
background: #fff;
}
.swiper-pagination-black .swiper-pagination-bullet-active {
background: #000;
}
.swiper-container-vertical > .swiper-pagination-bullets {
right: 10px;
top: 50%;
-webkit-transform: translate3d(0px, -50%, 0);
-moz-transform: translate3d(0px, -50%, 0);
-o-transform: translate(0px, -50%);
-ms-transform: translate3d(0px, -50%, 0);
transform: translate3d(0px, -50%, 0);
}
.swiper-container-vertical > .swiper-pagination-bullets .swiper-pagination-bullet {
margin: 5px 0;
display: block;
}
.swiper-container-horizontal > .swiper-pagination-bullets .swiper-pagination-bullet {
margin: 0 5px;
}
/* Progress */
.swiper-pagination-progress {
background: rgba(0, 0, 0, 0.25);
position: absolute;
}
.swiper-pagination-progress .swiper-pagination-progressbar {
background: #007aff;
position: absolute;
left: 0;
top: 0;
width: 100%;
height: 100%;
-webkit-transform: scale(0);
-ms-transform: scale(0);
-o-transform: scale(0);
transform: scale(0);
-webkit-transform-origin: left top;
-moz-transform-origin: left top;
-ms-transform-origin: left top;
-o-transform-origin: left top;
transform-origin: left top;
}
.swiper-container-rtl .swiper-pagination-progress .swiper-pagination-progressbar {
-webkit-transform-origin: right top;
-moz-transform-origin: right top;
-ms-transform-origin: right top;
-o-transform-origin: right top;
transform-origin: right top;
width: 185px;
margin-right: 8px;
float: left;
}
.swiper-container-horizontal > .swiper-pagination-progress {
width: 100%;
height: 4px;
left: 0;
top: 0;
}
.swiper-container-vertical > .swiper-pagination-progress {
width: 4px;
height: 100%;
left: 0;
top: 0;
}
.swiper-pagination-progress.swiper-pagination-white {
background: rgba(255, 255, 255, 0.5);
}
.swiper-pagination-progress.swiper-pagination-white .swiper-pagination-progressbar {
background: #fff;
}
.swiper-pagination-progress.swiper-pagination-black .swiper-pagination-progressbar {
background: #000;
}
/* 3D Container */
.swiper-container-3d {
-webkit-perspective: 1200px;
-moz-perspective: 1200px;
-o-perspective: 1200px;
perspective: 1200px;
}
.swiper-container-3d .swiper-wrapper,
.swiper-container-3d .swiper-slide,
.swiper-container-3d .swiper-slide-shadow-left,
.swiper-container-3d .swiper-slide-shadow-right,
.swiper-container-3d .swiper-slide-shadow-top,
.swiper-container-3d .swiper-slide-shadow-bottom,
.swiper-container-3d .swiper-cube-shadow {
-webkit-transform-style: preserve-3d;
-moz-transform-style: preserve-3d;
-ms-transform-style: preserve-3d;
transform-style: preserve-3d;
}
.swiper-container-3d .swiper-slide-shadow-left,
.swiper-container-3d .swiper-slide-shadow-right,
.swiper-container-3d .swiper-slide-shadow-top,
.swiper-container-3d .swiper-slide-shadow-bottom {
position: absolute;
left: 0;
top: 0;
width: 100%;
height: 100%;
pointer-events: none;
z-index: 10;
}
.swiper-container-3d .swiper-slide-shadow-left {
background-image: -webkit-gradient(linear, left top, right top, from(rgba(0, 0, 0, 0.5)), to(rgba(0, 0, 0, 0)));
/* Safari 4+, Chrome */
background-image: -webkit-linear-gradient(right, rgba(0, 0, 0, 0.5), rgba(0, 0, 0, 0));
/* Chrome 10+, Safari 5.1+, iOS 5+ */
background-image: -moz-linear-gradient(right, rgba(0, 0, 0, 0.5), rgba(0, 0, 0, 0));
/* Firefox 3.6-15 */
background-image: -o-linear-gradient(right, rgba(0, 0, 0, 0.5), rgba(0, 0, 0, 0));
/* Opera 11.10-12.00 */
background-image: linear-gradient(to left, rgba(0, 0, 0, 0.5), rgba(0, 0, 0, 0));
/* Firefox 16+, IE10, Opera 12.50+ */
}
.swiper-container-3d .swiper-slide-shadow-right {
background-image: -webkit-gradient(linear, right top, left top, from(rgba(0, 0, 0, 0.5)), to(rgba(0, 0, 0, 0)));
/* Safari 4+, Chrome */
background-image: -webkit-linear-gradient(left, rgba(0, 0, 0, 0.5), rgba(0, 0, 0, 0));
/* Chrome 10+, Safari 5.1+, iOS 5+ */
background-image: -moz-linear-gradient(left, rgba(0, 0, 0, 0.5), rgba(0, 0, 0, 0));
/* Firefox 3.6-15 */
background-image: -o-linear-gradient(left, rgba(0, 0, 0, 0.5), rgba(0, 0, 0, 0));
/* Opera 11.10-12.00 */
background-image: linear-gradient(to right, rgba(0, 0, 0, 0.5), rgba(0, 0, 0, 0));
/* Firefox 16+, IE10, Opera 12.50+ */
}
.swiper-container-3d .swiper-slide-shadow-top {
background-image: -webkit-gradient(linear, left top, left bottom, from(rgba(0, 0, 0, 0.5)), to(rgba(0, 0, 0, 0)));
/* Safari 4+, Chrome */
background-image: -webkit-linear-gradient(bottom, rgba(0, 0, 0, 0.5), rgba(0, 0, 0, 0));
/* Chrome 10+, Safari 5.1+, iOS 5+ */
background-image: -moz-linear-gradient(bottom, rgba(0, 0, 0, 0.5), rgba(0, 0, 0, 0));
/* Firefox 3.6-15 */
background-image: -o-linear-gradient(bottom, rgba(0, 0, 0, 0.5), rgba(0, 0, 0, 0));
/* Opera 11.10-12.00 */
background-image: linear-gradient(to top, rgba(0, 0, 0, 0.5), rgba(0, 0, 0, 0));
/* Firefox 16+, IE10, Opera 12.50+ */
}
.swiper-container-3d .swiper-slide-shadow-bottom {
background-image: -webkit-gradient(linear, left bottom, left top, from(rgba(0, 0, 0, 0.5)), to(rgba(0, 0, 0, 0)));
/* Safari 4+, Chrome */
background-image: -webkit-linear-gradient(top, rgba(0, 0, 0, 0.5), rgba(0, 0, 0, 0));
/* Chrome 10+, Safari 5.1+, iOS 5+ */
background-image: -moz-linear-gradient(top, rgba(0, 0, 0, 0.5), rgba(0, 0, 0, 0));
/* Firefox 3.6-15 */
background-image: -o-linear-gradient(top, rgba(0, 0, 0, 0.5), rgba(0, 0, 0, 0));
/* Opera 11.10-12.00 */
background-image: linear-gradient(to bottom, rgba(0, 0, 0, 0.5), rgba(0, 0, 0, 0));
/* Firefox 16+, IE10, Opera 12.50+ */
}
/* Coverflow */
.swiper-container-coverflow .swiper-wrapper,
.swiper-container-flip .swiper-wrapper {
/* Windows 8 IE 10 fix */
-ms-perspective: 1200px;
}
/* Cube + Flip */
.swiper-container-cube,
.swiper-container-flip {
overflow: visible;
}
.swiper-container-cube .swiper-slide,
.swiper-container-flip .swiper-slide {
pointer-events: none;
-webkit-backface-visibility: hidden;
-moz-backface-visibility: hidden;
-ms-backface-visibility: hidden;
backface-visibility: hidden;
z-index: 1;
}
.swiper-container-cube .swiper-slide .swiper-slide,
.swiper-container-flip .swiper-slide .swiper-slide {
pointer-events: none;
}
.swiper-container-cube .swiper-slide-active,
.swiper-container-flip .swiper-slide-active,
.swiper-container-cube .swiper-slide-active .swiper-slide-active,
.swiper-container-flip .swiper-slide-active .swiper-slide-active {
pointer-events: auto;
}
.swiper-container-cube .swiper-slide-shadow-top,
.swiper-container-flip .swiper-slide-shadow-top,
.swiper-container-cube .swiper-slide-shadow-bottom,
.swiper-container-flip .swiper-slide-shadow-bottom,
.swiper-container-cube .swiper-slide-shadow-left,
.swiper-container-flip .swiper-slide-shadow-left,
.swiper-container-cube .swiper-slide-shadow-right,
.swiper-container-flip .swiper-slide-shadow-right {
z-index: 0;
-webkit-backface-visibility: hidden;
-moz-backface-visibility: hidden;
-ms-backface-visibility: hidden;
backface-visibility: hidden;
}
/* Cube */
.swiper-container-cube .swiper-slide {
visibility: hidden;
-webkit-transform-origin: 0 0;
-moz-transform-origin: 0 0;
-ms-transform-origin: 0 0;
transform-origin: 0 0;
width: 100%;
height: 100%;
}
.swiper-container-cube.swiper-container-rtl .swiper-slide {
-webkit-transform-origin: 100% 0;
-moz-transform-origin: 100% 0;
-ms-transform-origin: 100% 0;
transform-origin: 100% 0;
}
.swiper-container-cube .swiper-slide-active,
.swiper-container-cube .swiper-slide-next,
.swiper-container-cube .swiper-slide-prev,
.swiper-container-cube .swiper-slide-next + .swiper-slide {
pointer-events: auto;
visibility: visible;
}
.swiper-container-cube .swiper-cube-shadow {
position: absolute;
left: 0;
bottom: 0px;
width: 100%;
height: 100%;
background: #000;
opacity: 0.6;
-webkit-filter: blur(50px);
filter: blur(50px);
z-index: 0;
}
/* Fade */
.swiper-container-fade.swiper-container-free-mode .swiper-slide {
-webkit-transition-timing-function: ease-out;
-moz-transition-timing-function: ease-out;
-ms-transition-timing-function: ease-out;
-o-transition-timing-function: ease-out;
transition-timing-function: ease-out;
}
.swiper-container-fade .swiper-slide {
pointer-events: none;
-webkit-transition-property: opacity;
-moz-transition-property: opacity;
-o-transition-property: opacity;
transition-property: opacity;
}
.swiper-container-fade .swiper-slide .swiper-slide {
pointer-events: none;
}
.swiper-container-fade .swiper-slide-active,
.swiper-container-fade .swiper-slide-active .swiper-slide-active {
pointer-events: auto;
}
/* Scrollbar */
.swiper-scrollbar {
border-radius: 10px;
position: relative;
-ms-touch-action: none;
background: rgba(0, 0, 0, 0.1);
}
.swiper-container-horizontal > .swiper-scrollbar {
position: absolute;
left: 1%;
bottom: 3px;
z-index: 50;
height: 5px;
width: 98%;
}
.swiper-container-vertical > .swiper-scrollbar {
position: absolute;
right: 3px;
top: 1%;
z-index: 50;
width: 5px;
height: 98%;
}
.swiper-scrollbar-drag {
height: 100%;
width: 100%;
position: relative;
background: rgba(0, 0, 0, 0.5);
border-radius: 10px;
left: 0;
top: 0;
}
.swiper-scrollbar-cursor-drag {
cursor: move;
}
/* Preloader */
.swiper-lazy-preloader {
width: 42px;
height: 42px;
position: absolute;
left: 50%;
top: 50%;
margin-left: -21px;
margin-top: -21px;
z-index: 10;
-webkit-transform-origin: 50%;
-moz-transform-origin: 50%;
transform-origin: 50%;
-webkit-animation: swiper-preloader-spin 1s steps(12, end) infinite;
-moz-animation: swiper-preloader-spin 1s steps(12, end) infinite;
animation: swiper-preloader-spin 1s steps(12, end) infinite;
}
.swiper-lazy-preloader:after {
display: block;
content: "";
width: 100%;
height: 100%;
background-position: 50%;
-webkit-background-size: 100%;
background-size: 100%;
background-repeat: no-repeat;
}
.swiper-lazy-preloader-white:after {
}
@-webkit-keyframes swiper-preloader-spin {
100% {
-webkit-transform: rotate(360deg);
}
}
@keyframes swiper-preloader-spin {
100% {
transform: rotate(360deg);
}
.swiper-wrapper {
margin-left: 0px;
}
... ...
... ... @@ -40,8 +40,8 @@
color: #fff;
}
.rec-swiper .swiper-slide, .brand-swiper .swiper-slide {
width: 185px;
.rec-swiper .swiper-wrapper{
height: 116px;
}
.brand-swiper .swiper-wrapper{
... ... @@ -50,7 +50,6 @@
.recommond-floor {
.rec-pro {
margin-bottom: 20px;
display: block;
.new-num {
... ... @@ -71,7 +70,7 @@
.swiper-slide > a img {
width: 100%;
height: 100%;
height: 86px;
}
.swiper-wrapper {
... ... @@ -137,6 +136,7 @@
width: 1150px;
font-size: 14px;
background: #fff;
padding: 10px 0;
z-index: 999;
.catagory-text {
... ... @@ -350,9 +350,10 @@
background-color: #000;
color: #fff;
text-align: center;
width: 80px;
width: 75px;
height: 32px;
line-height: 32px;
padding-right: 5px;
font-size: 13px;
-ms-filter: "progid:DXImageTransform.Microsoft.Alpha(Opacity=90)";
opacity: .9;
... ... @@ -383,7 +384,7 @@
> a {
color: #fff;
line-height: 22px;
line-height: 26px;
}
.msg-app {
... ... @@ -451,4 +452,24 @@
.all-catagory .catagory-navs {
width: 900px;
}
.swiper-slide {
width: 158px;
}
.rec-swiper .swiper-wrapper{
height: 104px;
img {
height: 73px;
}
}
.brand-swiper .swiper-wrapper{
height: 86px;
img {
height: 73px;
}
}
}
... ...