|
|
<!DOCTYPE html>
|
|
|
<html>
|
|
|
<head>
|
|
|
<meta charset="UTF-8">
|
|
|
<meta name="viewport" content="width=device-width, initial-scale=1.0, maximum-scale=1.0, minimum-scale=1.0 user-scalable=no">
|
|
|
<meta content="yes" name="apple-mobile-web-app-capable">
|
|
|
<meta content="yes" name="apple-touch-fullscreen">
|
|
|
<meta content="telephone=no" name="format-detection">
|
|
|
<meta content="black" name="apple-mobile-web-app-status-bar-style">
|
|
|
<title>YOHO!</title>
|
|
|
<meta name="keywords" content="yoho潮流志,yoho,有货 ,街拍,搭配,yoho有货,潮牌,潮品,潮人,潮流,潮货,滑板,街拍,街拍,原宿,陈冠希 ,CLOT,VISVIM,藤原浩neighborhood,EVISU,日本,东京,大阪,Bape,李灿森subcrew,牛仔裤,卫衣, outdoor,街头,vintage,流行,明星" />
|
|
|
<meta name="description" content="YOHO.CN潮流分享社区,全球潮流风向标!了解国内外最前沿的潮流资讯,预览当季至IN流行时尚街拍,分享你的购物经验,记录你的潮流生活!" />
|
|
|
<meta name="author" content="yoho.cn">
|
|
|
<link rel="dns-prefetch" href="//cdn.yoho.cn">
|
|
|
<link rel="dns-prefetch" href="//img01.res.yoho.cn">
|
|
|
<link rel="dns-prefetch" href="//img02.res.yoho.cn">
|
|
|
<link rel="stylesheet" href="http://cdn.yoho.cn/yohocn/160315/css/swiper.css">
|
|
|
<link rel="stylesheet" href="http://cdn.yoho.cn/yohocn/160315/css/mobile.css">
|
|
|
<style>
|
|
|
.swiper-yoho{background:url(http://img03.res.yoho.cn/blogimg/2016/07/27/14/012e0b81e91bc6bf405343e1ba6d3e38e6.png) no-repeat}
|
|
|
</style>
|
|
|
<script type="text/javascript">
|
|
|
if (document.documentElement.clientWidth < 640) {
|
|
|
document.getElementsByTagName("html")[0].style.fontSize = document.documentElement.clientWidth / 640 * 40 + 'px';
|
|
|
} else {
|
|
|
document.getElementsByTagName("html")[0].style.fontSize = '40px';
|
|
|
}
|
|
|
function updateOrientation() {
|
|
|
location.reload();
|
|
|
}
|
|
|
|
|
|
function getQueryString() {
|
|
|
var vars = [],
|
|
|
hash,
|
|
|
i;
|
|
|
var hashes = window.location.href.slice(window.location.href.indexOf('?') + 1);
|
|
|
return hashes;
|
|
|
}
|
|
|
</script>
|
|
|
</head>
|
|
|
<body onorientationchange="updateOrientation();" class="disable-default-action">
|
|
|
<div class="container">
|
|
|
<div class="banner"></div>
|
|
|
<div class="main">
|
|
|
<div class="slide-box">
|
|
|
<div class="swiper-wrapper clearfix">
|
|
|
<div class="swiper-slide yohobuy" tag="0">
|
|
|
<div class="swiper-yohobuy bg"></div>
|
|
|
<div class="ewm-area">
|
|
|
<img src="http://cdn.yoho.cn/yohocn/160315/images/ewm-yohobuy.png" />
|
|
|
<div class="ewm-info"></div>
|
|
|
</div>
|
|
|
<span class="download-btn">点击下载 · Yoho!Buy有货</span>
|
|
|
</div>
|
|
|
<div class="swiper-slide yohoboy" tag="1">
|
|
|
<div class="swiper-yoho bg"></div>
|
|
|
<div class="ewm-area">
|
|
|
<div class="left ewm-yoho" style="margin-left: 1.135rem; margin-right: 0.665rem;">
|
|
|
<img src="http://img03.res.yoho.cn/blogimg/2016/06/21/18/01bec2ddcbb55247b2ac4869b3e4255286.png" />
|
|
|
<i class="yoho-txt01"></i>
|
|
|
</div>
|
|
|
<div class="left ewm-yoho" style="margin-left: 0.665rem; margin-right: 1.135rem;">
|
|
|
<img src="http://cdn.yoho.cn/yohocn/160315/images/ewm-yoho02.png" />
|
|
|
<i class="yoho-txt02"></i>
|
|
|
</div>
|
|
|
<div class="ewm-info"></div>
|
|
|
</div>
|
|
|
<span class="download-btn">点击下载 · YOHO!</span>
|
|
|
</div>
|
|
|
<div class="swiper-slide yhsj" tag="2">
|
|
|
<div class="swiper-mars bg"></div>
|
|
|
<div class="ewm-area">
|
|
|
<img src="http://cdn.yoho.cn/yohocn/160315/images/ewm-mars.png" />
|
|
|
<div class="ewm-info"></div>
|
|
|
</div>
|
|
|
<span class="download-btn">点击下载 · MARS</span>
|
|
|
</div>
|
|
|
<div class="swiper-slide show" tag="3">
|
|
|
<div class="swiper-show bg"></div>
|
|
|
<div class="ewm-area">
|
|
|
<img src="http://cdn.yoho.cn/yohocn/160315/images/ewm-show.png" />
|
|
|
<div class="ewm-info"></div>
|
|
|
</div>
|
|
|
<span class="download-btn">点击下载 · SHOW</span>
|
|
|
</div>
|
|
|
</div>
|
|
|
</div>
|
|
|
<div class="slide-pagination clearfix">
|
|
|
</div>
|
|
|
</div>
|
|
|
<div class="footer">
|
|
|
CopyRight © 2007-2016 YOHO!新力传媒
|
|
|
</div>
|
|
|
<div class="mask">
|
|
|
<div class="wx-img1"></div>
|
|
|
<div class="wx-img2"></div>
|
|
|
<div class="wx-img3"></div>
|
|
|
</div>
|
|
|
</div>
|
|
|
<script src="http://cdn.yoho.cn/yohocn/160315/js/lib/mini.js"></script>
|
|
|
<script type="text/javascript">
|
|
|
seajs.use(["lib/jquery", "plugin/swiper"], function($, Swiper) {
|
|
|
var slideSwiper = null,
|
|
|
u = navigator.userAgent,
|
|
|
isAndroid = u.indexOf('Android') > -1 || u.indexOf('Adr') > -1,
|
|
|
isiOS = !!u.match(/\(i[^;]+;( U;)? CPU.+Mac OS X/),
|
|
|
isSafari = u.indexOf('Safari') > -1,
|
|
|
|
|
|
// TODO: 修改URL
|
|
|
jumpUrl = [
|
|
|
'http://192.168.102.205:8088/union/ClickUnionRest/addUnion4Jump?' + getQueryString(),
|
|
|
'http://union.yoho.cn/union/downyohoshow.html?'+getQueryString(),
|
|
|
'http://union.yoho.cn/union/downmars.html?'+ getQueryString(),
|
|
|
'http://union.yoho.cn/union/downshow.html?'+getQueryString(),
|
|
|
];
|
|
|
|
|
|
//初始化swiper插件
|
|
|
function initSwiper(num) {
|
|
|
slideSwiper = new Swiper('.slide-box', {
|
|
|
initialSlide: num,
|
|
|
loop: true,
|
|
|
autoplay: 5000,
|
|
|
autoplayDisableOnInteraction: false,
|
|
|
paginationClickable: true,
|
|
|
slideElement: '.swiper-slide',
|
|
|
pagination: '.main .slide-pagination'
|
|
|
});
|
|
|
}
|
|
|
|
|
|
//判断是不是微信浏览器
|
|
|
function isWeiXin() {
|
|
|
var u = navigator.userAgent,
|
|
|
ua = u.toLowerCase();
|
|
|
|
|
|
if (!!u.match(/AppleWebKit.*Mobile.*/)) {
|
|
|
if (ua.match(/MicroMessenger/i) && ua.match(/MicroMessenger/i)[0] === 'micromessenger') {
|
|
|
return true;
|
|
|
} else {
|
|
|
return false;
|
|
|
}
|
|
|
}
|
|
|
}
|
|
|
|
|
|
//打开对应的下载地址
|
|
|
function loadJump() {
|
|
|
var id = parseInt(location.hash.replace("#",""));
|
|
|
$('.loadding-area').hide();
|
|
|
if (slideSwiper != null) {
|
|
|
slideSwiper.destroy(true,true);
|
|
|
slideSwiper = null;
|
|
|
}
|
|
|
if (id >= 0 && jumpUrl[id] !== undefined) {
|
|
|
initSwiper(id);
|
|
|
window.location.href = jumpUrl[id];
|
|
|
window.location.hash = 'yes';
|
|
|
} else {
|
|
|
initSwiper(0);
|
|
|
}
|
|
|
}
|
|
|
|
|
|
window.onhashchange = function() {
|
|
|
var id = location.hash.replace("#","");
|
|
|
if (id === 'yes') {
|
|
|
return false;
|
|
|
}
|
|
|
if (isiOS && isSafari) {
|
|
|
location.reload();
|
|
|
// loadJump();
|
|
|
} else {
|
|
|
slideSwiper.stopAutoplay();
|
|
|
}
|
|
|
};
|
|
|
|
|
|
$(function() {
|
|
|
$('.loadding-area').hide();
|
|
|
var WeiXin = isWeiXin();
|
|
|
if (isAndroid && WeiXin) {
|
|
|
$('.wx-img2').hide();
|
|
|
$('.wx-img3').show();
|
|
|
}
|
|
|
|
|
|
$('.mask').css({
|
|
|
height: $(document).height()
|
|
|
});
|
|
|
|
|
|
//初始化页面
|
|
|
if ((isiOS && isSafari) || (isAndroid && !WeiXin)) {
|
|
|
loadJump();
|
|
|
} else {
|
|
|
initSwiper(0);
|
|
|
}
|
|
|
|
|
|
$(document).on('click', '.download-btn', function(e) {
|
|
|
if (e.target.className === 'download-btn') {
|
|
|
var id = $(this).parent().attr('tag');
|
|
|
|
|
|
if ((isiOS && WeiXin) || (isAndroid && WeiXin)) {
|
|
|
$('.mask').show();
|
|
|
$('body').scrollTop(0);
|
|
|
window.location.hash = id;
|
|
|
}
|
|
|
|
|
|
if ((isiOS && !WeiXin) || (isAndroid && !WeiXin)) {
|
|
|
slideSwiper.stopAutoplay();
|
|
|
window.location.href = jumpUrl[id];
|
|
|
setTimeout(function() {
|
|
|
slideSwiper.startAutoplay();
|
|
|
}, 3000);
|
|
|
}
|
|
|
}
|
|
|
});
|
|
|
$('.ewm-yoho img').on('touchstart', function() {
|
|
|
var $ewmArea = $(this).parent(),
|
|
|
index = $ewmArea.index(),
|
|
|
sbImg = $ewmArea.siblings('.ewm-yoho').find('img');
|
|
|
if (WeiXin) {
|
|
|
if (index === 0) {
|
|
|
sbImg.attr('src','http://cdn.yoho.cn/yohocn/160315/images/ewm-yoho02-no.png');//女生
|
|
|
}
|
|
|
if (index === 1) {
|
|
|
sbImg.attr('src','http://img03.res.yoho.cn/blogimg/2016/06/21/18/01db287fedae82aa7f0155727b0b5a0936.png');//男生
|
|
|
}
|
|
|
setTimeout(function() {
|
|
|
if (index === 0) {
|
|
|
sbImg.attr('src','http://cdn.yoho.cn/yohocn/160315/images/ewm-yoho02.png');//女生
|
|
|
}
|
|
|
if (index === 1) {
|
|
|
sbImg.attr('src','http://img03.res.yoho.cn/blogimg/2016/06/21/18/01bec2ddcbb55247b2ac4869b3e4255286.png');//男生
|
|
|
}
|
|
|
},2000);
|
|
|
}
|
|
|
});
|
|
|
$('.ewm-area img').on('touchstart', function() {
|
|
|
slideSwiper.stopAutoplay();
|
|
|
|
|
|
setTimeout(function() {
|
|
|
slideSwiper.startAutoplay();
|
|
|
}, 3000);
|
|
|
});
|
|
|
$('.mask').on('click', function() {
|
|
|
slideSwiper.startAutoplay();
|
|
|
$(this).hide();
|
|
|
});
|
|
|
});
|
|
|
});
|
|
|
</script>
|
|
|
</body>
|
|
|
</html> |
|
|
\ No newline at end of file |
...
|
...
|
|