/** * 首页 * @author: liangzhifeng<zhifeng.liang@yoho.cn> * @date: 2015/10/12 */ var $ = require('jquery'), Swiper = require('yoho.iswiper'), lazyLoad = require('yoho.lazyload'), $mobileWrap = $('.mobile-wrap'), $overlay = $('.overlay'), $sideNav = $('.side-nav'), $subNav = $('.sub-nav'), bannerSwiper, recommendSwiper, hotBrandsSwiper, trendTopicSwiper, goodsSwiper; var start = 0, swiperClass, $logotrans = $('.home-header .logo'), openSideNav = false, isen = true; lazyLoad($('img.lazy')); $('.nav-btn').on('touchstart', function(event) { $mobileWrap.addClass('menu-open'); $overlay.show().css('opacity', 0.3); $sideNav.addClass('on'); event.preventDefault(); event.stopPropagation(); openSideNav = true; return false; }); function hideSideBar() { openSideNav = false; if ($mobileWrap.hasClass('menu-open')) { $mobileWrap.removeClass('menu-open'); $('.overlay').hide(); $('.sub-nav').removeClass('show'); $sideNav.removeClass('on'); } } $('.overlay').on('touchstart', function(e) { hideSideBar(); return false; }); //禁止在侧边栏可以上下滚动 $('.side-nav').on('touchmove', function() { return false; }); //点击一级导航,弹出二级导航 $sideNav.on('touchstart', 'li', function(e) { if ($(this).find('.sub-nav').size() > 0) { $('.sub-nav').removeClass('show'); $(this).find('.sub-nav').addClass('show'); } e.stopPropagation(); if (e.target.pathname === location.pathname) { hideSideBar(); return false; } }); //返回一级导航,收起二级导航 $subNav.each(function() { $(this).find('li').eq(0).on('touchstart', function(e) { $('.sub-nav').removeClass('show'); e.stopPropagation(); return false; }); }).on('touchstart', function(e) { if (e.currentTarget !== e.target) { $subNav.find('li').removeClass('current'); } }); // 侧边栏点击背景色变化 $sideNav.children('ul').children('li').on('touchstart', function() { $sideNav.children('ul').children('li').css('background', '#fff'); $(this).css('background', '#eee'); }).on('touchend touchcancel', function() { $(this).css('background', '#fff'); }); //头部banner轮播 if ($('.banner-swiper').find('li').size() > 1) { bannerSwiper = new Swiper('.banner-swiper', { lazyLoading: true, lazyLoadingInPrevNext: true, loop: true, autoplay: 3000, autoplayDisableOnInteraction: false, paginationClickable: true, slideElement: 'li', pagination: '.banner-top .pagination-inner' }); } //热门品牌滑动 hotBrandsSwiper = new Swiper('.brands-swiper', { grabCursor: true, slidesPerView: 'auto', wrapperClass: 'brands-list', slideElement: 'li' }); //推荐搭配滑动 recommendSwiper = new Swiper('.recommend-swiper', { grabCursor: true, slidesPerView: 'auto', wrapperClass: 'recommend-list', slideElement: 'li' }); //潮品话题轮播 if ($('.trend-topic-swiper').find('li').size() > 1) { trendTopicSwiper = new Swiper('.trend-topic-swiper', { loop: true, autoplay: 3000, autoplayDisableOnInteraction: false, paginationClickable: true, slideElement: 'li', pagination: '.trend-topic-content .pagination-inner' }); } //潮流上装/经典裤装等轮播 $('.category-swiper').each(function(i, index) { swiperClass = 'category-swiper' + i; $(this).addClass(swiperClass); if ($('.' + swiperClass).find('.swiper-slide').size() > 1) { goodsSwiper = new Swiper('.' + swiperClass, { loop: true, autoplay: 3000, autoplayDisableOnInteraction: false, paginationClickable: true, slideElement: 'li', pagination: '.' + swiperClass + ' .pagination-inner' }); } }); //logo动画 function tsAnimate() { start = start + 10; $logotrans.css({ transform: 'rotateX(' + start + 'deg)', '-webkit-transform': 'rotateX(' + start + 'deg)', '-moz-transform': 'rotateX(' + start + 'deg)' }); if (start / 90 % 2 === 1) { if (isen) { $logotrans.addClass('animate'); isen = false; } else { $logotrans.removeClass('animate'); isen = true; } } if (start / 90 % 2 === 0 && start % 360 !== 0) { window.setTimeout(tsAnimate, 3000); } else { if (start % 360 === 0) { window.setTimeout(tsAnimate, 60 * 1000); } else { window.requestAnimationFrame(tsAnimate); } } } setTimeout(tsAnimate, 3000); $('.home-header .iconfont').on('touchstart', function() { $(this).addClass('highlight'); }).on('touchend touchcancel', function() { $(this).removeClass('highlight'); }); // 底部留出tab 的高度 window.reMarginFooter('.footer-tab'); //set cookie exports.set = function(c) { window.setCookie('_Channel', c, { expires: 365, domain: '.m.yohobuy.com' }); }; require('./maybe-like')();