|
|
@@ -1,6 +1,6 @@
|
|
|
<html>
|
|
|
<head>
|
|
|
-<title>企明星-翻牌活动</title>
|
|
|
+<title>猴年翻福牌，翻来好运气</title>
|
|
|
<meta name="viewport" content="width=device-width, initial-scale=1, maximum-scale=1, user-scalable=no">
|
|
|
<script type="text/javascript" src="http://res.wx.qq.com/open/js/jweixin-1.0.0.js"></script>
|
|
|
<script src="/js/jquery.js"></script>
|
|
|
@@ -54,6 +54,8 @@ body{
|
|
|
font-family: tahoma, arial, 'Hiragino Sans GB', 'Microsoft YaHei', 宋体, sans-serif;
|
|
|
-webkit-tap-highlight-color: transparent;
|
|
|
background-color: #B63845;
|
|
|
+ font-size: 100%;
|
|
|
+ text-align: center;
|
|
|
}
|
|
|
img{
|
|
|
vertical-align: sub;
|
|
|
@@ -99,7 +101,7 @@ img{
|
|
|
left: 50%;
|
|
|
margin-left: -145px;
|
|
|
display: none;
|
|
|
- font-size: 14px;
|
|
|
+ font-size:0.875em;
|
|
|
font-weight: bold;
|
|
|
text-align: center;
|
|
|
padding: 5px;
|
|
|
@@ -110,18 +112,18 @@ img{
|
|
|
margin-right: 3px;
|
|
|
}
|
|
|
.flop-tip>font{
|
|
|
- font-size: 12px;
|
|
|
+ font-size: 0.75em;
|
|
|
font-weight: normal;
|
|
|
}
|
|
|
.multiple{
|
|
|
- font-size: 22px;
|
|
|
+ font-size: 1.375em;
|
|
|
text-align: center;
|
|
|
position: relative;
|
|
|
width: 15px;
|
|
|
display: inline-block;
|
|
|
vertical-align: top;
|
|
|
overflow: hidden;
|
|
|
- height: 20px;
|
|
|
+ height: 25px;
|
|
|
}
|
|
|
.flop-notice{
|
|
|
color: #ffa461;
|
|
|
@@ -153,7 +155,7 @@ img{
|
|
|
height: 90px;
|
|
|
background-color: #ffffff;
|
|
|
}
|
|
|
-.flop-share>*{
|
|
|
+.flop-share>img{
|
|
|
display: inline-block;
|
|
|
width: 70px;
|
|
|
height: 70px;
|
|
|
@@ -162,10 +164,13 @@ img{
|
|
|
margin-top: 10px;
|
|
|
}
|
|
|
.flop-share>div{
|
|
|
+ display: inline-block;
|
|
|
width: 150px;
|
|
|
- padding-top: 10px;
|
|
|
line-height: 25px;
|
|
|
- font-size: 14px;
|
|
|
+ font-size: 0.875em;
|
|
|
+ position: relative;
|
|
|
+ top: 50%;
|
|
|
+ margin-top: -25px;
|
|
|
}
|
|
|
ul{
|
|
|
list-style: none;
|
|
|
@@ -177,6 +182,9 @@ ul{
|
|
|
left: 2px;
|
|
|
height: 155px;
|
|
|
}
|
|
|
+.random li{
|
|
|
+ height: 25px;
|
|
|
+}
|
|
|
</style>
|
|
|
</head>
|
|
|
<body>
|
|
|
@@ -206,6 +214,7 @@ ul{
|
|
|
<div class="flop-tip">
|
|
|
恭喜！你的企明星积分翻
|
|
|
<span class="multiple">
|
|
|
+ {{if eq .T.flag 1}}
|
|
|
<ul class="random">
|
|
|
<li>7</li>
|
|
|
<li>3</li>
|
|
|
@@ -215,6 +224,9 @@ ul{
|
|
|
<li>9</li>
|
|
|
<li>2</li>
|
|
|
</ul>
|
|
|
+ {{else if eq .T.flag 2}}
|
|
|
+ {{.T.multiple}}
|
|
|
+ {{end}}
|
|
|
</span>倍！<br>
|
|
|
您的积分已从{{.T.oldCredit}}分涨到{{.T.newCredit}}分。<br>
|
|
|
<font>积分明细请到企明星(www.qmx.top)查询！</font>
|
|
|
@@ -222,66 +234,81 @@ ul{
|
|
|
<script type="text/javascript">
|
|
|
if({{.T.IsOver}}){
|
|
|
alert("活动已经结束！");
|
|
|
-}
|
|
|
-$(function(){
|
|
|
- var windowWidth = $(window).width();
|
|
|
- var windowHeight = $(window).height();
|
|
|
- var defaultWidth = 320;
|
|
|
- var defaultHeight = 416;
|
|
|
- var width = 250;
|
|
|
- var height = 282.4;
|
|
|
- var top = 120;
|
|
|
- var noticeTop = 80;
|
|
|
- if(windowHeight > defaultHeight){
|
|
|
- top = top / defaultHeight * windowHeight;
|
|
|
- noticeTop = noticeTop / defaultHeight * windowHeight;
|
|
|
- }
|
|
|
- if(windowWidth > defaultWidth && windowHeight > defaultHeight){
|
|
|
- width = width / defaultWidth * windowWidth;
|
|
|
- if(width > 350){//最大宽度350
|
|
|
- width = 350
|
|
|
+}else{
|
|
|
+ $(function(){
|
|
|
+ var windowWidth = $(window).width();
|
|
|
+ var windowHeight = $(window).height();
|
|
|
+ var defaultWidth = 320;
|
|
|
+ var defaultHeight = 416;
|
|
|
+ var width = 250;
|
|
|
+ var height = 282.4;
|
|
|
+ var cardTop = 120;
|
|
|
+ var noticeTop = 80;
|
|
|
+ if(windowWidth > 750){
|
|
|
+ $(".body-bg").css({width: 750,height: windowHeight});
|
|
|
}
|
|
|
- height = width / 625 * 706;
|
|
|
- $(".cards>img").css({width: width,height: height}).show();
|
|
|
- }
|
|
|
- $(".cards").css({"top": top}).show();
|
|
|
- $(".flop-notice").css({"top": noticeTop});
|
|
|
- if(windowHeight - $(".cards").height() - top - $(".flop-tip").height() > 40){
|
|
|
- $(".flop-tip").css({"line-height": "30px",top: $(".cards").height()+top});
|
|
|
- }else{
|
|
|
- $(".flop-tip").css({"top": $(".cards").height()+top-30});
|
|
|
- }
|
|
|
- //
|
|
|
- {{if eq .T.flag 1}}
|
|
|
- $(".btn").css({"top": $(".cards").height()+top}).show();
|
|
|
- $(".btn").click(function(){
|
|
|
- $("#flop-before,.btn").hide();
|
|
|
- $("#flop-after,.flop-tip,.flop-notice").show();
|
|
|
- var marginTop = 0;
|
|
|
- var plus = true;
|
|
|
- var randomInterval = setInterval(function(){
|
|
|
- $(".random").css({top : "-22px"});
|
|
|
- $(".random").append($(".random li:first"));
|
|
|
- },20);
|
|
|
- setTimeout(function(){
|
|
|
- clearInterval(randomInterval);
|
|
|
- $(".multiple").html({{.T.multiple}});
|
|
|
- },1000);
|
|
|
- setTimeout(function(){
|
|
|
- $(".bubble").fadeIn();
|
|
|
- },3000);
|
|
|
- $('.cards').children('img:first').stop().animate({'width':0},100,function(){
|
|
|
- $(this).hide().next().show();
|
|
|
- $(this).next().animate({'width':width+'px'},500);
|
|
|
+ if(windowHeight > defaultHeight){
|
|
|
+ cardTop = cardTop / defaultHeight * windowHeight;
|
|
|
+ noticeTop = noticeTop / defaultHeight * windowHeight;
|
|
|
+ }
|
|
|
+ if(windowWidth > defaultWidth && windowHeight > defaultHeight){
|
|
|
+ width = width / defaultWidth * windowWidth;
|
|
|
+ if(width > 350){//最大宽度350
|
|
|
+ width = 350
|
|
|
+ }
|
|
|
+ height = width / 625 * 706;
|
|
|
+ $(".cards>img").css({width: width,height: height});
|
|
|
+ }
|
|
|
+ $(".cards").css({top: cardTop}).show();
|
|
|
+ $(".flop-notice").css({top: noticeTop});
|
|
|
+ var flopTipTop = windowHeight - $(".cards").height() - cardTop - $(".flop-tip").height();
|
|
|
+ if(flopTipTop > 30 && flopTipTop < 40){
|
|
|
+ $(".flop-tip").css({"line-height": "30px",top: $(".cards").height() + cardTop - 20});
|
|
|
+ }else if(flopTipTop > 40){
|
|
|
+ $(".flop-tip").css({"line-height": "30px",top: $(".cards").height() + cardTop - 10});
|
|
|
+ }else{
|
|
|
+ $(".flop-tip").css({top: $(".cards").height()+cardTop-30});
|
|
|
+ }
|
|
|
+ //
|
|
|
+ {{if eq .T.flag 1}}
|
|
|
+ $(".btn").css({top: $(".cards").height()+cardTop}).show();
|
|
|
+ $(".btn").one("click",function(){
|
|
|
+ //
|
|
|
+ $.post("/active/flopAjax",null,null);
|
|
|
+ $("#flop-before,.btn").hide();
|
|
|
+ $("#flop-after,.flop-tip,.flop-notice").show();
|
|
|
+ var randomInterval = setInterval(function(){
|
|
|
+ $(".random").css({top : "-27px"});
|
|
|
+ $(".random").append($(".random li:first"));
|
|
|
+ },20);
|
|
|
+ setTimeout(function(){
|
|
|
+ clearInterval(randomInterval);
|
|
|
+ $(".multiple").html({{.T.multiple}});
|
|
|
+ },1000);
|
|
|
+ setTimeout(function(){
|
|
|
+ $(".bubble").fadeIn();
|
|
|
+ },3000);
|
|
|
+ $('.cards').children('img:first').stop().animate({'width':0},100,function(){
|
|
|
+ $(this).hide().next().show();
|
|
|
+ $(this).next().animate({'width':width+'px'},500);
|
|
|
+ });
|
|
|
});
|
|
|
- });
|
|
|
- {{else}}
|
|
|
- $(".flop-notice").show();
|
|
|
- {{end}}
|
|
|
- {{if eq .T.flag 2}}
|
|
|
- $(".flop-tip").show();
|
|
|
- {{end}}
|
|
|
-});
|
|
|
+ {{else}}
|
|
|
+ $(".flop-notice").show();
|
|
|
+ {{end}}
|
|
|
+ {{if eq .T.flag 2}}
|
|
|
+ $(".flop-tip").show();
|
|
|
+ {{end}}
|
|
|
+ {{if eq .T.flag 3}}
|
|
|
+ var shareHeight = windowHeight - cardTop - height + 30;
|
|
|
+ if(shareHeight > 110){
|
|
|
+ shareHeight = 110;
|
|
|
+ }
|
|
|
+ $(".flop-share").css({height: shareHeight});
|
|
|
+ $(".flop-share>img").css({width: shareHeight-20,height: shareHeight-20});
|
|
|
+ {{end}}
|
|
|
+ });
|
|
|
+}
|
|
|
</script>
|
|
|
</body>
|
|
|
</html>
|
