Skip to content

Instantly share code, notes, and snippets.

@naoyeye
Last active August 29, 2015 14:08
Show Gist options
  • Save naoyeye/cc861183c48ee411d410 to your computer and use it in GitHub Desktop.
Save naoyeye/cc861183c48ee411d410 to your computer and use it in GitHub Desktop.
<!DOCTYPE html>
<html>
<head>
<title>搜狗高速浏览器双十一网购专版-剁手族的福音</title>
<meta content="text/html"; charset="utf-8"; http-equiv="Content-Type"/>
<meta name="viewport" content="width=device-width, initial-scale=1.0, maximum-scale=1.0, user-scalable=1">
<script src="js/zepto.min.js"></script>
<style>
html,body{
overflow:hidden;
width:100%;
height:100%;
margin:0px;
}
*{
overflow:hidden;
}
#box{
overflow:hidden;
width:100%;
height:100%;
}
.ins{
z-index:1;
}
.cont{
z-index:2;
}
.yin{
z-index:3;
}
#box .logo{
z-index: 3;
top: 0px;
opacity: 0;
width: 100%;
position: fixed;
height: 13%;
background: url(images/logo.png) no-repeat left top;
background-size: contain;
left: 0px;
}
#box .logo.show{
-ms-transition: all 0.3s linear; /* IE 9 */
-moz-transition: all 0.3s linear; /* Firefox */
-webkit-transition: all 0.3s linear; /* Safari 和 Chrome */
-o-transition: all 0.3s linear;
-webkit-transition: all 0.3s linear;
transition: all 0.3s linear;
opacity: 1;
}
.box{
width:100%;
height:100%;
position:absolute;
display:none;
}
.cont{
position:absolute;
background-size:contain;
background-position:center center;
background-repeat: no-repeat;
-ms-transition: all 0.3s ease-in; /* IE 9 */
-moz-transition: all 0.3s ease-in; /* Firefox */
-webkit-transition: all 0.3s ease-in; /* Safari 和 Chrome */
-o-transition: all 0.3s ease-in;
-webkit-transition: all 0.3s ease-in;
transition: all 0.3s ease-in;
opacity:0;
}
#box1{
background-color:#6096e6;
}
#box2{
background-color:#f1ca52;
}
#box3{
background-color:#f8695c;
}
#box4{
background-color:#ebb651;
}
#box5{
background-color:#4bce81;
}
#box6{
background-color:#6096e6;
}
#box1 .cont{
opacity: 1;
position: absolute;
left:5%;
-webkit-transform:scale(1.2,1.2);
top: 13%;
height: 48%;
width: 90%;
}
#box1 .cont.show{
opacity:1;
-webkit-transform:scale(1,1);
background-image:url(images/c1_c.png);
}
#box1 .title{
position:absolute;
top:61%;
-webkit-transform:translate3D(0,5%,0);
height:15%;
width:90%;
left:5%;
background-position:center center;
background-repeat: no-repeat;
background-size:contain;
opacity:0;
-ms-transition: all 0.3s linear; /* IE 9 */
-moz-transition: all 0.3s linear; /* Firefox */
-webkit-transition: all 0.3s linear; /* Safari 和 Chrome */
-o-transition: all 0.3s linear;
-webkit-transition: all 0.3s linear;
transition: all 0.3s linear;
}
#box1 .title.show{
-webkit-transform:translate3D(0,0,0);
background-image:url(images/c1_t.png?);
opacity:1;
}
/*22222222*/
#box2 .title{
position:absolute;
top:16%;
-webkit-transform:translate3D(-6%,0,0);
height:15%;
width:100%;
background-position:center center;
background-repeat: no-repeat;
background-size:contain;
opacity:0;
-ms-transition: all 0.3s linear; /* IE 9 */
-moz-transition: all 0.3s linear; /* Firefox */
-webkit-transition: all 0.3s linear; /* Safari 和 Chrome */
-o-transition: all 0.3s linear;
-webkit-transition: all 0.3s linear;
transition: all 0.3s linear;
}
#box2 .title.show{
-webkit-transform:translate3D(0,0,0);
background-image:url(images/c2_t.png);
opacity:1;
}
#box2 .ins{
position:absolute;
-webkit-transform:translate3D(-6%,0,0);
top: 36%;
left: 13%;
height: 20%;
width: 37%;
background-position:center center;
background-repeat: no-repeat;
background-size:contain;
opacity:0;
-ms-transition: all 0.3s linear; /* IE 9 */
-moz-transition: all 0.3s linear; /* Firefox */
-webkit-transition: all 0.3s linear; /* Safari 和 Chrome */
-o-transition: all 0.3s linear;
-webkit-transition: all 0.3s linear;
transition: all 0.3s linear;
}
#box2 .ins.show{
-webkit-transform:translate3D(0,0,0);
opacity: 1;
background-image: url(images/c2_i.png);
}
#box2 .yin{
position: absolute;
top: 57%;
left: 15%;
height: 11%;
width: 30%;
-webkit-transform:scale(1.2,1.2);
background-position:center center;
background-repeat: no-repeat;
background-size:contain;
opacity:0;
-ms-transition: all 0.3s linear; /* IE 9 */
-moz-transition: all 0.3s linear; /* Firefox */
-webkit-transition: all 0.3s linear; /* Safari 和 Chrome */
-o-transition: all 0.3s linear;
-webkit-transition: all 0.3s linear;
transition: all 0.3s linear;
}
#box2 .yin.show{
opacity: 1;
-webkit-transform:scale(1,1);
background-image: url(images/c2_y.png);
}
#box2 .cont{
opacity: 1;
position: absolute;
left: 16%;
top: 32%;
height: 53%;
width: 90%;
}
#box2 .cont.show{
opacity:1;
/*top:0px;*/
-ms-transform:translate3D(-10%,0,0);
-moz-transform:translate3D(-10%,0,0);
-webkit-transform:translate3D(-10%,0,0);
-o-transform:translate3D(-10%,0,0);
-webkit-transform: translate3D(-10%,0,0);
transform: translate3D(-10%,0,0);
background-image:url(images/c2_c.png);
}
#box3 .cont{
opacity: 1;
position: absolute;
left:5%;
-webkit-transform:scale(0.8,0.8);
top: 25%;
height: 48%;
width: 90%;
}
/*33333*/
#box3 .cont.show{
opacity:1;
-webkit-transform:scale(1,1);
background-image:url(images/c3_c.png);
}
#box3 .title{
position: absolute;
top: 10%;
-webkit-transform: translate3D(0,-6%,0);
height: 22%;
width: 90%;
left: 5%;
background-position:center center;
background-repeat: no-repeat;
background-size:contain;
opacity:0;
-ms-transition: all 0.3s linear; /* IE 9 */
-moz-transition: all 0.3s linear; /* Firefox */
-webkit-transition: all 0.3s linear; /* Safari 和 Chrome */
-o-transition: all 0.3s linear;
-webkit-transition: all 0.3s linear;
transition: all 0.3s linear;
}
#box3 .title.show{
-webkit-transform:translate3D(0,0,0);
background-image:url(images/c3_t.png);
opacity:1;
}
#box3 .ins{
position:absolute;
-webkit-transform:translate3D(0,6%,0);
top: 73%;
left: 5%;
height: 16%;
width: 90%;
background-position:center center;
background-repeat: no-repeat;
background-size:contain;
opacity:0;
-ms-transition: all 0.3s linear; /* IE 9 */
-moz-transition: all 0.3s linear; /* Firefox */
-webkit-transition: all 0.3s linear; /* Safari 和 Chrome */
-o-transition: all 0.3s linear;
-webkit-transition: all 0.3s linear;
transition: all 0.3s linear;
}
#box3 .ins.show{
-webkit-transform:translate3D(0,0,0);
opacity: 1;
background-image: url(images/c3_i.png);
}
#box3 .yin{
position: absolute;
top: 63%;
left: 15%;
height: 11%;
width: 30%;
-webkit-transform:scale(1.2,1.2);
background-position:center center;
background-repeat: no-repeat;
background-size:contain;
opacity:0;
-ms-transition: all 0.3s linear; /* IE 9 */
-moz-transition: all 0.3s linear; /* Firefox */
-webkit-transition: all 0.3s linear; /* Safari 和 Chrome */
-o-transition: all 0.3s linear;
-webkit-transition: all 0.3s linear;
transition: all 0.3s linear;
}
#box3 .yin.show{
opacity: 1;
-webkit-transform:scale(1,1);
background-image: url(images/c3_y.png);
}
/*4444444*/
#box4 .cont{
opacity: 1;
position: absolute;
-webkit-transform:scale(1.2,1.2) translate3D(-10%,10%,0);
left:5%;
top: 25%;
height: 48%;
width: 90%;
}
#box4 .cont.show{
opacity:1;
-webkit-transform:scale(1,1) translate3D(0,0,0);
background-image:url(images/c4_c.png);
}
#box4 .title{
position:absolute;
top: 8%;
left:5%;
-webkit-transform: translate3D(5%,0,0);
height: 22%;
width: 90%;
background-position:center center;
background-repeat: no-repeat;
background-size:contain;
opacity:0;
-ms-transition: all 0.3s linear; /* IE 9 */
-moz-transition: all 0.3s linear; /* Firefox */
-webkit-transition: all 0.3s linear; /* Safari 和 Chrome */
-o-transition: all 0.3s linear;
-webkit-transition: all 0.3s linear;
transition: all 0.3s linear;
}
#box4 .title.show{
-webkit-transform:translate3D(0,0,0);
background-image:url(images/c4_t.png);
opacity:1;
}
#box4 .ins{
position:absolute;
-webkit-transform:translate3D(5%,0,0);
top:73%;
left:10%;
height:17%;
width:50%;
background-position:center center;
background-repeat: no-repeat;
background-size:contain;
opacity:0;
-ms-transition: all 0.3s linear; /* IE 9 */
-moz-transition: all 0.3s linear; /* Firefox */
-webkit-transition: all 0.3s linear; /* Safari 和 Chrome */
-o-transition: all 0.3s linear;
-webkit-transition: all 0.3s linear;
transition: all 0.3s linear;
}
#box4 .ins.show{
-webkit-transform:translate3D(0,0,0);
opacity: 1;
background-image: url(images/c4_i.png);
}
#box4 .yin{
position: absolute;
top: 73%;
left: 61%;
height: 17%;
width: 35%;
-webkit-transform:scale(1.2,1.2);
background-position:center center;
background-repeat: no-repeat;
background-size:contain;
opacity:0;
-ms-transition: all 0.3s linear; /* IE 9 */
-moz-transition: all 0.3s linear; /* Firefox */
-webkit-transition: all 0.3s linear; /* Safari 和 Chrome */
-o-transition: all 0.3s linear;
-webkit-transition: all 0.3s linear;
transition: all 0.3s linear;
}
#box4 .yin.show{
opacity: 1;
-webkit-transform:scale(1,1);
background-image: url(images/c4_y.png);
}
/*5555555*/
#box5 .cont{
opacity: 1;
position: absolute;
-webkit-transform:scale(0.8,0.8);
left:5%;
top: 25%;
height: 48%;
width: 90%;
}
#box5 .cont.show{
opacity:1;
-webkit-transform:scale(1,1);
background-image:url(images/c5_c.png);
}
#box5 .title{
position:absolute;
top: 11%;
-webkit-transform: translate3D(0,-6%,0);
height: 19%;
width: 90%;
left: 5%;
background-position:center center;
background-repeat: no-repeat;
background-size:contain;
opacity:0;
-ms-transition: all 0.3s linear; /* IE 9 */
-moz-transition: all 0.3s linear; /* Firefox */
-webkit-transition: all 0.3s linear; /* Safari 和 Chrome */
-o-transition: all 0.3s linear;
-webkit-transition: all 0.3s linear;
transition: all 0.3s linear;
}
#box5 .title.show{
-webkit-transform:translate3D(0,0,0);
background-image:url(images/c5_t.png);
opacity:1;
}
#box5 .ins{
position:absolute;
-webkit-transform:translate3D(0,6%,0);
top: 73%;
left: 5%;
height: 10%;
width: 90%;
background-position:center center;
background-repeat: no-repeat;
background-size:contain;
opacity:0;
-ms-transition: all 0.3s linear; /* IE 9 */
-moz-transition: all 0.3s linear; /* Firefox */
-webkit-transition: all 0.3s linear; /* Safari 和 Chrome */
-o-transition: all 0.3s linear;
-webkit-transition: all 0.3s linear;
transition: all 0.3s linear;
}
#box5 .ins.show{
-webkit-transform:translate3D(0,0,0);
opacity: 1;
background-image: url(images/c5_i.png);
}
#box5 .yin{
position: absolute;
top: 25%;
left: 60%;
height: 17%;
width: 35%;
-webkit-transform:scale(1.2,1.2);
background-position:center center;
background-repeat: no-repeat;
background-size:contain;
opacity:0;
-ms-transition: all 0.3s linear; /* IE 9 */
-moz-transition: all 0.3s linear; /* Firefox */
-webkit-transition: all 0.3s linear; /* Safari 和 Chrome */
-o-transition: all 0.3s linear;
-webkit-transition: all 0.3s linear;
transition: all 0.3s linear;
}
#box5 .yin.show{
opacity: 1;
-webkit-transform:scale(1,1);
background-image: url(images/c5_y.png);
}
/*6666666*/
#box6 .cont{
opacity: 1;
position: absolute;
-webkit-transform:translate3D(0,7%,0);
left: 5%;
top: 44%;
height: 35%;
width: 90%;
}
#box6 .cont.show{
opacity:1;
-webkit-transform:translate3D(0,0,0);
background-image:url(images/c6_c.png);
}
#box6 .title{
left: 5%;
position: absolute;
top: 10%;
-webkit-transform:translate3D(0,-7%,0);
height: 34%;
width: 90%;
background-position: center center;
background-repeat: no-repeat;
background-size:contain;
opacity:0;
-ms-transition: all 0.3s linear; /* IE 9 */
-moz-transition: all 0.3s linear; /* Firefox */
-webkit-transition: all 0.3s linear; /* Safari 和 Chrome */
-o-transition: all 0.3s linear;
-webkit-transition: all 0.3s linear;
transition: all 0.3s linear;
}
#box6 .title.show{
-webkit-transform:translate3D(0,0,0);
background-image:url(images/c6_t.png);
opacity:1;
}
#box6 .yin{
position: absolute;
top: 79%;
left: 5%;
height: 8%;
width: 90%;
background-position:center center;
background-repeat: no-repeat;
background-size:contain;
opacity:0;
-ms-transition: all 0.3s linear; /* IE 9 */
-moz-transition: all 0.3s linear; /* Firefox */
-webkit-transition: all 0.3s linear; /* Safari 和 Chrome */
-o-transition: all 0.3s linear;
-webkit-transition: all 0.3s linear;
transition: all 0.3s linear;
}
#box6 .yin.show{
opacity: 1;
-webkit-transform:scale(1,1);
background-image: url(images/c6_btn.png);
}
#box6 .cont #dl{
display:block;
position:absolute;
bottom:0px;
left:0px;
height:20%;
width:100%;
}
#down_index{width: 100%;height: 78px;background-size: contain;background: url(images/down_index.png) no-repeat center center;position: absolute;bottom: 4%;left: 0px;}
.down{
-ms-transition: all 0.3s linear; /* IE 9 */
-moz-transition: all 0.3s linear; /* Firefox */
-webkit-transition: all 0.3s linear; /* Safari 和 Chrome */
-o-transition: all 0.3s linear;
-webkit-transition: all 0.3s linear;
transition: all 0.3s linear;
z-index:3;
width: 90%;height: 6%;background-size: contain;background-image: url(images/down.png?v);background-repeat:no-repeat;background-position:center center;position: fixed;bottom: 4%;left: 5%;opacity: 0;
-ms-transform: translate3D(0,9%,0); /* IE 9 */
-moz-transform: translate3D(0,9%,0); /* Firefox */
-webkit-transform: translate3D(0,9%,0); /* Safari 和 Chrome */
-o-transform: translate3D(0,9%,0);
-webkit-transform: translate3D(0,9%,0);
transform: translate3D(0,9%,0);
overflow:visible;
}
@-webkit-keyframes down{
0% {-webkit-transform:translate3D(0,0%,0);}
50% {-webkit-transform:translate3D(0,20%,0);}
100% {-webkit-transform:translate3D(0,0%,0);}
}
.down.show{
opacity: 1;
-ms-transform: translate3D(0,0,0); /* IE 9 */
-moz-transform: translate3D(0,0,0); /* Firefox */
-webkit-transform: translate3D(0,0,0); /* Safari 和 Chrome */
-o-transform: translate3D(0,0,0);
-webkit-transform: translate3D(0,0,0);
transform: translate3D(0,0,0);
-webkit-animation: down 2s linear infinite;
}
.down span{
font-size:12px;
top:-20px;
color:#fff;
font-family: "Microsoft yahei";
position:absolute;
left:0px;
width:100%;
text-align: center;
}
#box1{position:absolute;left:0px;height:100%;display:block;}
#box2{position:absolute;left:0px;height:100%;display:block;}
.slide{
-ms-transition: all 0.5s ease-in-out; /* IE 9 */
-moz-transition: all 0.5s ease-in-out; /* Firefox */
-webkit-transition: all 0.5s ease-in-out; /* Safari 和 Chrome */
-o-transition: all 0.5s ease-in-out;
-webkit-transition: all 0.5s ease-in-out;
transition: all 0.5s ease-in-out;
}
.mid{
/* top:0px; */
-ms-transform:translate3D(0,0,0); /* IE 9 */
-moz-transform:translate3D(0,0,0); /* Firefox */
-webkit-transform:translate3D(0,0,0); /* Safari 和 Chrome */
-o-transform:translate3D(0,0,0);
-webkit-transform: translate3D(0,0,0);
transform: translate3D(0,0,0);
}
.top{
/* top:-100%; */
-ms-transform:translate3D( 0, -100%,0 ); /* IE 9 */
-moz-transform:translate3D( 0, -100% ,0); /* Firefox */
-webkit-transform:translate3D( 0, -100%,0 ); /* Safari 和 Chrome */
-o-transform:translate3D( 0, -100% ,0);
-webkit-transform: translate3D( 0, -100%,0 );
transform: translate3D( 0, -100% );
}
.bottom{
/* top:100%; */
-ms-transform:translate3D( 0, 100% ,0); /* IE 9 */
-moz-transform:translate3D( 0, 100% ,0); /* Firefox */
-webkit-transform:translate3D( 0, 100%,0 ); /* Safari 和 Chrome */
-o-transform:translate3D( 0, 100%,0 );
-webkit-transform: translate3D( 0, 100% ,0);
transform: translate3D( 0, 100% ,0);
}
#bg{
z-index:-1;
width:100%;
height:100%;
position:absolute;
left:0px;
top:0px;
background:#000;
opacity:0;
-ms-transition: all 0.3s linear; /* IE 9 */
-moz-transition: all 0.3s linear; /* Firefox */
-webkit-transition: all 0.3s linear; /* Safari 和 Chrome */
-o-transition: all 0.3s linear;
-webkit-transition: all 0.3s linear;
transition: all 0.3s linear;
}
#bg.show{
z-index:3;
opacity: 0.9;
}
#bg .weixin{
position: absolute;
background-image:url(images/share_a.png);
background-position:center center;
background-repeat:no-repeat;
background-size:contain;
width:90%;
top: 20%;
left: 5%;
height: 39%;
}
#bg .nowei{
position: absolute;
background-image: url(images/share_a_n.png);
background-position: center center;
background-repeat: no-repeat;
background-size: contain;
width: 80%;
top: 30%;
left: 10%;
height: 39%;
}
</style>
<meta content="双11来啦!大家准备好做首富背后的剁手女人了吗! 剁还是不剁?搜狗浏览器给剁手族带来三宝:网页加速,打假神器,还有现金红包一样都不能少! 搜狗浏览器 抢iPhone6 抢iPhone6 plus;抢现金红包;淘宝比价;双十一" name="description">
<body>
<div id="box">
<a class="logo" href="http://mse.sogou.com/"></a>
<div class="down">
<span>继续浏览&nbsp;惊喜不断</span>
</div>
<div id="box1" class="box mid">
<div class="cont"></div>
<div class="title"></div>
<div class="ins"></div>
<div class="yin"></div>
</div>
<div id="box2" class="box bottom">
<div class="cont"></div>
<div class="title"></div>
<div class="ins"></div>
<div class="yin"></div>
</div>
<div id="box3" class="box">
<div class="cont"></div>
<div class="title"></div>
<div class="ins"></div>
<div class="yin"></div>
</div>
<div id="box4" class="box">
<div class="cont"></div>
<div class="title"></div>
<div class="ins"></div>
<div class="yin"></div>
</div>
<div id="box5" class="box">
<div class="cont"></div>
<div class="title"></div>
<div class="ins"></div>
<div class="yin"></div>
</div>
<div id="box6" class="box">
<div class="cont"></div>
<div class="title"></div>
<div class="ins"></div>
<div class="yin"></div>
</div>
</div>
<div id="bg">
<div class="tips"></div>
</div>
<script>
window.addEventListener('touchmove', function (e) {
e.preventDefault();
});
var pingback;
Zepto(function($){
for(var i=1;i<=6;i++){
document.createElement('img').src="images/c"+i+"_c.png";
}
var scroller= new myscroll();
pingback= new pingback();
scroller.showEle();
pingback.pv(scroller.index);
$(".logo").on("tap",function(){
return false;
});
$("#box6 .yin").on("tap",function(){
if(is_weixn()){
$("#bg .tips").addClass("weixin");
$("#bg").addClass("show");
pingback.onclick("share");
}else{
$("#bg .tips").addClass("nowei");
$("#bg").addClass("show");
pingback.onclick("sharenowx");
}
return false;
});
$("#bg").on("tap",function(){
$("#bg").removeClass("show");
});
$(".down").on("tap",function(){
scroller.next();
return false;
});
$("#box").swipeUp(function(event){
scroller.next();
event.preventDefault();
});
$("#box").swipeDown(function(event){
scroller.prev();
event.preventDefault();
});
});
function myscroll(){
this.index = 1;
this.length = 7;
this.circle = 0;
this.fixedIndex = function() {
this.index = this.index>6?1:(this.index<1)?6:this.index
};
// 直接使用 css3 动画效果.
this.next = function() {
var oldindex = this.index;
var self = this;
if(this.isanimate){
return false;
}
$(".down span").hide();
$(".down").addClass("show");
this.isanimate = 1;
// @NOTE: 索引从 0 开始.
this.fixedIndex( ++this.index );
index = this.index;
$("#box"+index).offset();
$("#box"+index).show();
$("#box"+index).removeClass( 'top' ).addClass( 'bottom' );
$('.mid' ).addClass("slide").offset();
$('.mid' ).removeClass( 'mid' ).addClass( 'top' );
//$( '.bottom' ).offset();
$("#box"+index).addClass("slide").offset();
$("#box"+index).removeClass( 'bottom' ).addClass( 'mid' );
$('.mid' ).one("webkitTransitionEnd",function(){
self.isanimate= 0;
self.showEle();
$(".slide").removeClass("slide");
})
pingback.pv(this.index);
};
this.prev = function(){
var oldindex = this.index;
var self = this;
if(this.isanimate||(this.index==1&&this.circle==0)){
return false;
}
$(".down span").hide();
$(".down").addClass("show");
this.isanimate = 1;
// @NOTE: 索引从 0 开始.
this.fixedIndex( --this.index );
var index = this.index;
$("#box"+index).offset();
$("#box"+index).show();
$("#box"+index).removeClass( 'bottom' ).addClass( 'top' );
$( '.mid' ).addClass("slide").offset();
$( '.mid' ).removeClass( 'mid' ).addClass( 'bottom' );
//$( '.top' ).offset();
$("#box"+index).addClass("slide").offset();
$("#box"+index).removeClass( 'top' ).addClass( 'mid' );
$('.mid' ).one("webkitTransitionEnd",function(){
self.isanimate= 0;
self.showEle();
$(".slide").removeClass("slide");
})
pingback.pv(this.index);
};
this.showEle=function(){
var self =this;
var index = this.index;
switch(this.index){
case 1:{
$(".down span").show();
$("#box"+index+" .cont").offset();
$("#box"+index+" .cont").addClass("show").one("webkitTransitionEnd",function(){
$(".logo").addClass("show");
$("#box"+index+" .title").addClass("show").one("webkitTransitionEnd",function(){
$(".down").addClass("show");
});
});
break;
}
case 2:{
$("#box"+index+" .cont").offset();
$("#box"+index+" .cont").addClass("show");
$("#box"+index+" .title").addClass("show");
$("#box"+index+" .ins").addClass("show").one("webkitTransitionEnd",function(){
$("#box"+index+" .yin").addClass("show");
});
break;
}
case 3:
$("#box"+index+" .cont").offset();
$("#box"+index+" .cont").addClass("show");
$("#box"+index+" .cont").one("webkitTransitionEnd",function(){
$("#box"+index+" .title").addClass("show");
$("#box"+index+" .ins").addClass("show").one("webkitTransitionEnd",function(){
$("#box"+index+" .yin").addClass("show");
});
});
break;
case 4:
$("#box"+index+" .cont").offset();
$("#box"+index+" .cont").addClass("show");
$("#box"+index+" .cont").one("webkitTransitionEnd",function(){
$("#box"+index+" .title").addClass("show");
setTimeout(function(){
$("#box"+index+" .ins").addClass("show").one("webkitTransitionEnd",function(){
$("#box"+index+" .yin").addClass("show");
});
},300);
});
break;
case 5:
self.circle = 1;
$("#box"+index+" .cont").offset();
$("#box"+index+" .cont").addClass("show");
$("#box"+index+" .cont").one("webkitTransitionEnd",function(){
$("#box"+index+" .title").addClass("show");
$("#box"+index+" .ins").addClass("show").one("webkitTransitionEnd",function(){
$("#box"+index+" .yin").addClass("show");
});
});
break;
case 6:
$(".down").removeClass("show");
$("#box"+index+" .cont").offset();
$("#box"+index+" .cont").addClass("show");
$("#box"+index+" .title").addClass("show").one("webkitTransitionEnd",function(){
$("#box"+index+" .yin").addClass("show");
});
break;
}
}
}
function is_weixn(){
var ua = navigator.userAgent.toLowerCase();
if(ua.match(/MicroMessenger/i)=="micromessenger") {
return true;
} else {
return false;
}
}
//pingback
function getCookie1(offset) {
var endstr = document.cookie.indexOf (";", offset);
if (endstr == -1) endstr = document.cookie.length;
return unescape(document.cookie.substring(offset, endstr));
}
function getCookie2(name) {
var arg = name + "=";
var alen = arg.length;
var clen = document.cookie.length;
var i = 0;
while (i < clen) {
var j = i + alen;
if (document.cookie.substring(i, j) == arg) return getCookie1(j);
i = document.cookie.indexOf(" ", i) + 1;
if (i == 0) break;
}
return null; }
function setCookie(name, value, exptime, domain){
var domain = domain ? domain : "ie.sogou.com";
var exp = new Date();
exp.setTime(exp.getTime() + exptime);
document.cookie = name + "=" + value + ";path=/;expires=" + exp.toGMTString() + ";domain=" + domain + ";";
}
var pingback = function(){
var pingServerUrl = "http://ping.ie.sogou.com/";
var n = new Date().getTime();
var c = escape(n*1000+Math.round(Math.random()*1000));
this.getUid = function(){
var uid = "";
if(getCookie2("SMYUV") != null) {
uid = getCookie2("SMYUV");
} else {
uid = c;
setCookie("SMYUV", uid, 2592000000, "sogou.com");
}
return uid;
}
this.refurl = document.referrer == ""? "" : encodeURIComponent(document.referrer);
this.pl = encodeURIComponent(window.location.href);
this.u = this.getUid();
this.onclick = function(type){
var clickImg =document.createElement('img');
clickImg.src = pingServerUrl + "ct.GIF?t="+c+"&u="+ this.u +"&r="+this.refurl+"&pl="+this.pl+"&type=" +type;
}
this.pv = function(index){
var clickImg =document.createElement('img');
clickImg.src = pingServerUrl + "pv.GIF?t="+c+"&u="+ this.u +"&r="+this.refurl+"&pl="+this.pl+"&index=" +index;
}
};
var tit = "搜狗浏览器双十一网购专版,狂送iPhone 6 和千元红包!";
var content = "双11来啦! 搜狗浏览器给剁手族带来三宝:网页加速,打假神器,现金红包一样都不能少!";
if(typeof(window.shareData) == 'undefined'){
window.shareData = {
"imgUrl": "http://"+window.location.host+"/zhuanban/gouwu/mob/images/share.png",
"timeLineLink": "http://"+window.location.host+"/zhuanban/gouwu/mob/",
"sendFriendLink": "http://"+window.location.host+"/zhuanban/gouwu/mob/",
"weiboLink": "http://"+window.location.host+"/zhuanban/gouwu/mob/",
"tTitle": tit,
"tContent": content,
"fTitle": tit,
"fContent": content,
"wContent": content
}
}
document.addEventListener('WeixinJSBridgeReady', function onBridgeReady() {
// 发送给好友
WeixinJSBridge.on('menu:share:appmessage', function (argv) {
WeixinJSBridge.invoke('sendAppMessage', {
"img_url": window.shareData.imgUrl,
"img_width": "640",
"img_height": "640",
"link": window.shareData.sendFriendLink,
"desc": window.shareData.fContent,
"title": window.shareData.fTitle
}, function (res) {
// var json = JSON.parse(res.err_msg);
if(res.err_msg.split(":")[1]=="ok"){
$Jason.ping.getPv("share");
window.location = "http://"+window.location.host+"/html/guess/index.html";
}
weimobAfterShare("",window.shareData.sendFriendLink,'appmessage');
_report('send_msg', res.err_msg);
})
});
// 分享到朋友圈
WeixinJSBridge.on('menu:share:timeline', function (argv) {
WeixinJSBridge.invoke('shareTimeline', {
"img_url": window.shareData.imgUrl,
"img_width": "640",
"img_height": "640",
"link": window.shareData.timeLineLink,
"desc": window.shareData.tContent,
"content":window.shareData.tContent,
"title": window.shareData.tTitle+","+window.shareData.tContent
}, function (res) {
//weimobAfterShare("",window.shareData.timeLineLink,'timeline');
if(res.err_msg.split(":")[1]=="ok"){
$Jason.ping.getPv("share");
window.location = "http://"+window.location.host+"/html/guess/index.html";
}
_report('timeline', res.err_msg);
});
});
// 分享到微博
WeixinJSBridge.on('menu:share:weibo', function (argv) {
WeixinJSBridge.invoke('shareWeibo', {
"content": window.shareData.wContent,
"url": window.shareData.weiboLink
}, function (res) {
weimobAfterShare("",window.shareData.weiboLink,'weibo');
_report('weibo', res.err_msg);
});
});
}, false);
</script>
</body>
</html>
Sign up for free to join this conversation on GitHub. Already have an account? Sign in to comment