gain.html 10.1 KB

Raw Blame History Permalink

<!DOCTYPE html>
<html lang="en">
<head>
	<meta charset="UTF-8">
	<title>有货&可口可乐</title>
	<meta name="apple-mobile-web-app-title" content="SUMMER SALE">
    <meta name="format-detection" content="telephone=no">
    <meta name="viewport" content="width=device-width,initial-scale=1.0,maximum-scale=1.0,user-scalable=no,minimal-ui" media="(device-height: 568px)">
    <meta name="apple-mobile-web-app-capable" content="yes">
    <meta name="apple-mobile-web-app-status-bar-style" content="grey">
	<style type="text/css">
		*{
			margin: 0;
			padding: 0;
			font-size: 14px;
		}
		html,body{
			width: 100%;
			height: 100%;
			background: #e10c1e;
		}
		.page{
			width: 100%;
			height: 100%;
			background: #e10c1e;

		}
		.banner{
			width: 100%;
			height: auto;
			overflow: hidden;
		}
		.banner img{
			width: 100%;
			height: auto;
		}
		.centent{
			width: 100%;
			height: auto;
			overflow: hidden;
			padding-top: 2rem;
			padding-bottom: .6rem;
			background: #e10c1e;
		}
		.centent p{
			width: 100%;
			height: auto;
			overflow: hidden;
			text-align: center;
			color: #fff;
			line-height: 2rem;
			font-size: .9rem
		}
		.centent p.phone{
			font-size: 1.3rem;
			font-weight: bold;
			line-height: 2.6rem;
		}
		.coupon{
			width: 81.25%;
			height: auto;
			overflow: hidden;
			margin: 0 auto;
		}
		.coupon img{
			width: 100%;
			height: auto;
		}
		.dialog{
			width: 82%;
			height: 14rem;
			position: absolute;
			background: #fff;
			border-radius: .6rem;
			left:9%;
			top: 45%;
			margin-top: -7rem;
			z-index: 2;
		}
		.dialog .close{
			width: 1.4rem;
			height: 1.4rem;
			overflow: hidden;
			background: #444;
			color: #f1f1f1;
			border-radius: 50%;
			position: absolute;
			top: -.5rem;
			right: -.5rem;
			line-height: 1.4rem;
			text-align: center;
		}
		.dialog .close img{
			width: 100%;
			height: auto;
		}
		.dialog .inform{
			width: 100%;
			height: 6rem;
			overflow: hidden;
			text-align: center;
			padding-top: 1.5rem;
			line-height: 2.4rem;
		}
		.dialog .inform h3{
			font-size: 1.5rem;
		}
		.dialog .inform span{
			font-size: 1rem;
		}
		.dialog .btn-list{
			width: 110%;
			height: 3.4rem;
			overflow: hidden;
			border-top: 1px solid #c5c5c5;
		}
		.btn-list span{
			width: 45.5%;
			height: 3.4rem;
			overflow: hidden;
			float: left;
			border-right: 1px solid #c5c5c5;
			line-height: 3.4rem;
			text-align: center;
			font-size: 1.2rem;
		}
		.btn-list a{
			text-decoration:none;
			color: #000;
		}
		.hidden{
			display: none;
		}
		.keep-out{
			width: 100%;
			height: 100%;
			overflow: hidden;
			background-color: #000;
			opacity: 0.4;
			position: absolute;
			top: 0;
			left: 0;
			z-index: 1;
		}
		.activity-message{
			overflow: auto;
		}
		.activity-message h3{
			width: 100%;
			height: 3.4rem;
			padding-top: .6rem;
			line-height: 3.4rem;
			font-size: 1.2rem;
			text-align: center;
		}
		.activity-message p{
			width: 85%;
			height: auto;
			overflow: hidden;
			margin:0 auto;
			line-height: 2rem;
		}
		.footer{
			width: 100%;
			height: auto;
			overflow: hidden;
			padding-bottom: 2rem;
		}
		.footer .btn{
			width: 75.25%;
			height:auto;
			margin: 0 auto 1.6rem;
		}
		.footer .btn img{
			width: 100%;
			height: auto;
		}
		.footer span{
			font-weight: bold;
			display: inline-block;
			width: 20%;
			height: auto;
			text-align: center;
			color: #fff;
			margin: 0 40%;
		}
	</style>
</head>
<body>
	<div class="page">
		<div class="banner">
            <img src="/activity/cocacola/images/cokeBanner.jpg">
		</div>
		<div class="centent">
			<div class="coupon">
                <img src="/activity/cocacola/images/cokeCoupon.png">
			</div>
            <p class="phone" id="mobile"></p>
			<p>登录Yoho!Buy有货客户端即可使用</p>
		</div>
		<div class="footer">
			<div class="btn">
                <img src="/activity/cocacola/images/cokeBtn.png">
			</div>
			<span>活动说明</span>
		</div>
	</div>
	<div class="dialog hidden" style="height: 11rem;" id="dialog">
		<div class="content" style="overflow: hidden;">
			<div class="inform">
				<h3>恭喜您成功领取</h3>
				<span>Yoho!Buy有货优惠券</span>
			</div>
			<div class="btn-list">
				<span>下载Yoho!Buy有货</span>
				<span style="color: red;">我知道了</span>
			</div>
		</div>
	</div>
	<div class="keep-out hidden"></div>
	<div class="dialog hidden" id="message">
		<span class="close"><img src="/activity/cocacola/images/close.png"></span>
		<div class="activity-message">
			<h3>活动说明</h3>
			<div class="message">
				<P>1、活动时间：2016年4月7日到2016年7月7日</P>
				<P>2、仅限新注册用户以及首次购买用户使用</P>
				<P>3、同一手机号限领一次优惠券</P>
			</div>
		</div>
	</div>
</body>
<script type="text/javascript" src="/activity/js/jquery-1.12.0.min.js"></script>
<script type="text/javascript">
(function(w, d, s, j, f) {
    var a = d.createElement(s);
    var m = d.getElementsByTagName(s)[0];

    w.YohoAcquisitionObject = f;

    w[f] = function() {
        w[f].p = arguments;
    };

    a.async = 1;
    a.src = j;
    m.parentNode.insertBefore(a, m);
})(window, document, 'script', 'http://cdn.yoho.cn/yas-jssdk/1.0.14/yas.js', '_yas');
(function() {
    if (window._yas) {
        window._yas(1 * new Date(), '1.0.14', '', '', '', '');
    }
}());
</script>
<script type="text/javascript">

	function getQueryStr(key){
	    var svalue = location.search.match(new RegExp("[\?\&]" + key + "=([^\&]*)(\&?)","i"));
	    var str = svalue ? svalue[1] : svalue;
	    return str == null ? "" : str;
	}
	$(function() {
	    $("#mobile").html("优惠券已放至账户" + getQueryStr("mobile"));
	});


	$('.close').on('click', function(){
		$('.dialog').addClass('hidden');
		$('.keep-out').addClass('hidden');
		$('#dialog .content').html(' ')
	})
	$('.footer span').on('click',function(){
		$('#message').removeClass('hidden');
		$('.keep-out').removeClass('hidden');
	})
	setTimeout(function(){
		$('#dialog').removeClass('hidden');
		$('.keep-out').removeClass('hidden');
	},1000)
	$('.btn').on('click',function(){
		if (window._yas) {
			window._yas.sendCustomInfo({
    			'downApp': 'Y'
			}, true);
		}
		setTimeout(function(){
			window.location.href = "http://a.app.qq.com/o/simple.jsp?pkgname=com.yoho";
		}, 2000)
	})
	$('.btn-list span:eq(1)').on('click',function(){
		$('.dialog').addClass('hidden');
		$('.keep-out').addClass('hidden');
	})
	$('.btn-list span:eq(0)').on('click',function(){
		if (window._yas) {
			window._yas.sendCustomInfo({
    			'downApp': 'Y'
			}, true);
		}
		setTimeout(function(){
			window.location.href = "http://a.app.qq.com/o/simple.jsp?pkgname=com.yoho";
		}, 2000)
	})
</script>
<script type="text/javascript" src="http://res.wx.qq.com/open/js/jweixin-1.1.0.js"></script>
<script type="text/javascript">
/**
 * 微信分享
 */
 (function($) {
	    if (typeof(wx) == "undefined") {
	        return;
	    }
	    /* var shareUrl = "";
	    $.ajax({
	    	async : false,
	    	url : "/activity/cocacola/CocacolaController/getWechatShareUrl",
	    	dataType : "json",
	    	cache : false,
	    	success : function(data) {
	    		if (!data || data.code != 200) {
	    			return;
	    		}
	    		shareUrl = data.data.wechatShareUrl;
	    	}
	    }); */
	    var _weChatInterface = 'http://www.yohoshow.com/api/wechat/getSignPackage';
	    var shareTitle = '来Yoho!Buy有货玩潮流，潮流逛不停';
	    //var shareImg = 'http://img12.static.yhbimg.com/activity/2016/04/07/11/02b3b297581ace1ca6251f7f9e67ca7937.jpg';
	    var shareImg = "http://img10.static.yhbimg.com/activity/2016/04/22/18/011ec22354d4e299d23f9699695f1a763c.jpg";
	    var shareDesc = '揭盖赢福利，潮流逛不停';
	    //var shareLink = "http://feature.yoho.cn/activity/cocacola/index.html";
	    var shareLink = "http://service.yoho.cn/activity/cocacola/html/index1.html";
	    $.getJSON(_weChatInterface + '?pageurl=' +
	            encodeURIComponent(location.href.split('#')[0]) + '&callback=?', function(json) {
	        var _appId, _timestamp, _nonceStr, _signature;
	        if (json !== undefined && json !== '') {
	            _appId = json.appId.toString();
	            _timestamp = json.timestamp;
	            _nonceStr = json.nonceStr.toString();
	            _signature = json.signature.toString();

	            wx.config({
	                debug: false,
	                appId: _appId,
	                timestamp: _timestamp,
	                nonceStr: _nonceStr,
	                signature: _signature,
	                jsApiList: [
	                    'checkJsApi',
	                    'onMenuShareTimeline',
	                    'onMenuShareAppMessage',
	                    'onMenuShareQQ',
	                    'onMenuShareWeibo',
	                    'hideMenuItems',
	                    'showMenuItems',
	                    'hideAllNonBaseMenuItem',
	                    'showAllNonBaseMenuItem',
	                    'translateVoice',
	                    'startRecord',
	                    'stopRecord',
	                    'onRecordEnd',
	                    'playVoice',
	                    'pauseVoice',
	                    'stopVoice',
	                    'uploadVoice',
	                    'downloadVoice',
	                    'chooseImage',
	                    'previewImage',
	                    'uploadImage',
	                    'downloadImage',
	                    'getNetworkType',
	                    'openLocation',
	                    'getLocation',
	                    'hideOptionMenu',
	                    'showOptionMenu',
	                    'closeWindow',
	                    'scanQRCode',
	                    'chooseWXPay',
	                    'openProductSpecificView',
	                    'addCard',
	                    'chooseCard',
	                    'openCard'
	                ]
	            });
	        }
	    });
	    wx.ready(function() {

	        var shareData = {
	            title: shareTitle,
	            desc: shareDesc,
	            imgUrl: shareImg,
	            link: shareLink
	        };
	        wx.onMenuShareAppMessage(shareData);
	        wx.onMenuShareTimeline(shareData);
	        wx.onMenuShareQQ(shareData);
	        wx.onMenuShareWeibo(shareData);
	    });
	}(jQuery));
 </script>
</html>