手机摇一摇代码

 

http://tgwu.net/ldj/?from=singlemessage&isappinstalled=0

// JavaScript Document

$(function(){
    w = $(document).width();    
    h = $(document).height();
    $(\'body\').height(h);
    $(\'body\').width(w);
    $(\'.main\').height(h);
    $(\'.main\').width(w);
                
});
//初始化js


$(function() {            
        //Enable swiping...
        $("#tit1").swipe( {
            //Generic swipe handler for all directions
            swipeUp:function(event, direction, distance, duration, fingerCount) {
                        $(\'.tit1\').fadeOut(\'slow\');        //隐藏第2页
                        $(\'.tit2\').css(\'top\',h+\'px\');    
                        $(\'.tit2\').css(\'display\',\'block\');
                        $(\'.tit2\').animate({top:\'0\'},800);
                        $(\'.tit1\').css(\'z-index\',\'99\');
                        $(\'.tit2\').css(\'z-index\',\'100\');
            },
            swipeDown:function(event, direction, distance, duration, fingerCount) {
            }, 
            click:function(event,target){
                if(target.id == "ddd"){
                    $(\'.tit1-con\').fadeIn(200);    
                }
                if(target.id == "ddd1"){
                    $(\'.tit1-con\').hide();
                }
                
        
                
                
            },
            //Default is 75px, set to 0 for demo so any distance triggers swipe
           threshold:0
        });
        $("#tit2").swipe( {
            //Generic swipe handler for all directions
            swipeUp:function(event, direction, distance, duration, fingerCount) {
                        $(\'.tit2\').fadeOut(\'slow\');        //隐藏第1页
                        $(\'.tit3\').css(\'top\',h+\'px\');
                        $(\'.tit3\').css(\'display\',\'block\');
                        $(\'.tit3\').animate({top:\'0\'},800);
                        $(\'.tit2\').css(\'z-index\',\'99\');
                        $(\'.tit3\').css(\'z-index\',\'100\');
            },
            swipeDown:function(event, direction, distance, duration, fingerCount) {
                        $(\'.tit2\').fadeOut(\'slow\');        //隐藏第2页
                        $(\'.tit1\').slideDown();
                        $(\'.tit1\').css(\'z-index\',\'100\');
                        $(\'.tit2\').css(\'z-index\',\'99\');
            },
            //Default is 75px, set to 0 for demo so any distance triggers swipe
           threshold:0
        });
        $("#tit3").swipe( {
            //Generic swipe handler for all directions
            swipeUp:function(event, direction, distance, duration, fingerCount) {
                        $(\'.tit3\').fadeOut(\'slow\');        //隐藏第3页
                        $(\'.tit4\').css(\'display\',\'block\');
                        $(\'.tit4\').css(\'top\',h+\'px\');
                        $(\'.tit4\').animate({top:\'0\'},800);
                        $(\'.tit3\').css(\'z-index\',\'99\');
                        $(\'.tit4\').css(\'z-index\',\'100\');
            },
            swipeDown:function(event, direction, distance, duration, fingerCount) {
                        $(\'.tit3\').fadeOut(\'slow\');        //隐藏第2页
                        $(\'.tit2\').slideDown();
                        $(\'.tit2\').css(\'z-index\',\'100\');
                        $(\'.tit3\').css(\'z-index\',\'99\');
            },
            //Default is 75px, set to 0 for demo so any distance triggers swipe
           threshold:0
        });
        
        
        $("#tit4").swipe( {
            //Generic swipe handler for all directions
            swipeUp:function(event, direction, distance, duration, fingerCount) {
                        $(\'.tit4\').fadeOut(\'slow\');        //隐藏第4页
                        $(\'.tit5\').css(\'display\',\'block\');
                        $(\'.tit5\').css(\'top\',h+\'px\');
                        $(\'.tit5\').animate({top:\'0\'},800);
                        $(\'.tit4\').css(\'z-index\',\'99\');
                        $(\'.tit5\').css(\'z-index\',\'100\');
                        setTimeout(aa,1000) 
                        function aa(){
                            $(\'.tit551\').show();
                        }
                        setTimeout(a1,1000);
                        function a1(){
                            $(\'.tit551-5\').fadeIn(300);    
                        }
                        setTimeout(a2,1500);
                        function a2(){
                            $(\'.tit551-5\').fadeOut(500);    
                        }
                        
                        setTimeout(b1,2500);
                        function b1(){
                            $(\'.tit551-4\').fadeIn(300);    
                        }
                        setTimeout(b2,3000);
                        function b2(){
                            $(\'.tit551-4\').fadeOut(500);    
                        }
                        
                        setTimeout(c1,4000);
                        function c1(){
                            $(\'.tit551-3\').fadeIn(300);    
                        }
                        setTimeout(c2,4500);
                        function c2(){
                            $(\'.tit551-3\').fadeOut(500);    
                        }
                        
                        setTimeout(d1,5500);
                        function d1(){
                            $(\'.tit551-2\').fadeIn(300);    
                        }
                        setTimeout(d2,6000);
                        function d2(){
                            $(\'.tit551-2\').fadeOut(500);    
                        }
                        
                        setTimeout(e1,7000);
                        function e1(){
                            $(\'.tit551-1\').fadeIn(300);    
                        }
                        setTimeout(e2,7500);
                        function e2(){
                            $(\'.tit551-1\').fadeOut(500);    
                        }
                        
                        setTimeout(bb,8000) 
                        function bb(){
                            $(\'.tit55\').show();    
                        }
                        
                        $(\'.yaodong\').change();
                        setTimeout(function(){
                            if($(\'.weixin\').val() == \'\'){
                                $.post(\'php.php\',{openid:$(\'#openid\').val()},function(json){
                                    var p = json.prize; //奖项 
                                    var c = json.level; //ID
                                    var d = json.start; //状态
                                    var q = json.num; //剩余次数
                                    if(d == 1){
                                        $(\'.tit552-3\').siblings().hide();
                                        $(\'.tit552-3\').fadeIn(300);
                                        window.removeEventListener(\'devicemotion\',deviceMotionHandler, false);
                                    }else if(d == 2){
                                        $(\'.tit552-\'+c).fadeIn(300);
                                        $(\'.tit552-\'+c).siblings().hide();
                                        //$(\'.weixin\').val(\'",我获得"\'+p);
                                        window.removeEventListener(\'devicemotion\',deviceMotionHandler, false);
                                    }else if(d == 3){
                                        //$(\'.tit552-4\').fadeIn(300);
                                        //$(\'#fanhui\').text(\'您没有中奖..\');
                                        $(\'.tit552-3\').siblings().hide();
                                        $(\'.tit552-3\').fadeIn(300);
                                        window.removeEventListener(\'devicemotion\',deviceMotionHandler, false);
                                    }
                                },\'JSON\');
                            }    
                            
                        },12000) 
                        
                        
            },
            swipeDown:function(event, direction, distance, duration, fingerCount) {
                        $(\'.tit4\').fadeOut(\'slow\');        //隐藏第2页
                        $(\'.tit3\').slideDown();
                        $(\'.tit3\').css(\'z-index\',\'100\');
                        $(\'.tit4\').css(\'z-index\',\'99\');
            },
            //Default is 75px, set to 0 for demo so any distance triggers swipe
           threshold:0
        });
        $("#tit5").swipe( {
            //Generic swipe handler for all directions
            swipeUp:function(event, direction, distance, duration, fingerCount) {
            },
            swipeDown:function(event, direction, distance, duration, fingerCount) {
            },
            click:function(event,target){
                if(target.id == "weixin1" || target.id == "weixin2" || target.id == "weixin3" || target.id == "weixin4" ){
                    location.href=\'http://mp.weixin.qq.com/s?__biz=MzA4MTU5NjIwMg==&mid=200182749&idx=1&sn=7cbcbfaf281303392d7ca6f412d6b90a#rd\';
                }
                if(target.id == "tijiao"){
                    var name = $(\'.tit552-1-1\').val();
                    var phone = $(\'.tit552-1-2\').val();
                    if(name == \'\' || phone == \'\'){
                        alert(\'不能为空\');    
                    }
                    $.post(\'php.php\',{status:\'ok\',name:name,phone:phone,openid:$(\'#openid\').val()},function(){
                        alert(\'提交成功\')    ;
                        $(\'#tijiao\').hide();
                    });
                }
                if(target.id == "weixin1" || target.id == "weixin2" || target.id == "weixin3"){
                    location.href=\'http://mp.weixin.qq.com/s?__biz=MzA4MTU5NjIwMg==&mid=200182749&idx=1&sn=7cbcbfaf281303392d7ca6f412d6b90a#rd\';
                }
                if(target.id == "chongshi"){
                    //window.addEventListener(\'devicemotion\',deviceMotionHandler, false);
                    $(\'.tit552-4\').fadeOut(300);
                    yaodong();
                }
            },
            //Default is 75px, set to 0 for demo so any distance triggers swipe
           threshold:0
        }); 
        
        
        $(\'.yaodong\').change(function(){
            yaodong();
        });
        
        /*微信分享*/
        var imgUrl = \'http://tgwu.net/ldj/images/weixin.jpg\';
        var lineLink = \'http://tgwu.net/ldj\';
        var appid = \'\';
        var descContent = "不劳而获倒数5秒免费送美国进口零食！【麦芽糖优品生活】";
        var shareTitle = \'不劳而获倒数5秒免费送美国进口零食！【麦芽糖优品生活】\';
        
        function shareFriend() {
            WeixinJSBridge.invoke(\'sendAppMessage\',{
                "appid": appid,
                "img_url": imgUrl,
                "img_width": "200",
                "img_height": "200",
                "link": lineLink,
                "desc": descContent,
                "title": shareTitle
            }, function(res) {
                //_report(\'send_msg\', res.err_msg);
            })
        }
        function shareTimeline() {
            WeixinJSBridge.invoke(\'shareTimeline\',{
                "img_url": imgUrl,
                "img_width": "200",
                "img_height": "200",
                "link": lineLink,
                "desc": descContent,
                "title": shareTitle
            }, function(res) {
                   //_report(\'timeline\', res.err_msg);
            });
        }
        function shareWeibo() {
            WeixinJSBridge.invoke(\'shareWeibo\',{
                "content": descContent,
                "url": lineLink,
            }, function(res) {
                //_report(\'weibo\', res.err_msg);
            });
        }
        // 当微信内置浏览器完成内部初始化后会触发WeixinJSBridgeReady事件。
        document.addEventListener(\'WeixinJSBridgeReady\', function onBridgeReady() {
            // 发送给好友
            WeixinJSBridge.on(\'menu:share:appmessage\', function(argv){
                shareFriend();
            });
            // 分享到朋友圈
            WeixinJSBridge.on(\'menu:share:timeline\', function(argv){
                shareTimeline();
            });
            // 分享到微博
            WeixinJSBridge.on(\'menu:share:weibo\', function(argv){
                shareWeibo();
            });
        }, false);
        
        
});
    
    
function yaodong(){
        if (window.DeviceMotionEvent) {
            window.addEventListener(\'devicemotion\',deviceMotionHandler, false);
        }
        var SHAKE_THRESHOLD = 2000;
        var last_update = 0; 
        var x, y, z, last_x=0, last_y=0, last_z=0;
        function deviceMotionHandler(eventData) {
            var acceleration =eventData.accelerationIncludingGravity; // 获取含重力的加速度
            var myDate = new Date();
            var curTime = myDate.getTime(); // 获取当前时间
            if ((curTime-last_update)> 100) { 
                var diffTime = curTime -last_update;//时间差
                last_update = curTime;
                x = acceleration.x;
                y = acceleration.y;
                z = acceleration.z;
                var speed = Math.abs(x+y+z-last_x-last_y-last_z)/diffTime*10000;
                if (speed > SHAKE_THRESHOLD) {
                    $(\'.weixin\').val(\'2222\');
                    //$(\'.img52\').find("img").jshaker();
                    $(\'.img52\').find("img").animate({left:\'-50px\'},200);
                    $(\'.img52\').find("img").animate({left:\'50px\'},200);
                    $(\'.img52\').find("img").animate({left:\'0\'},200);
                    document.getElementById(\'my1\').play();
                    //window.removeEventListener(\'devicemotion\',deviceMotionHandler, false);
                        $.post(\'php.php\',{openid:$(\'#openid\').val()},function(json){
                            var p = json.prize; //奖项 
                            var c = json.level; //ID
                            var d = json.start; //状态
                            var q = json.num; //剩余次数
                            if(d == 1){
                                $(\'.tit552-3\').siblings().hide();
                                $(\'.tit552-3\').fadeIn(300);
                                window.removeEventListener(\'devicemotion\',deviceMotionHandler, false);
                            }else if(d == 2){
                                $(\'.tit552-\'+c).fadeIn(300);
                                $(\'.tit552-\'+c).siblings().hide();
                                //$(\'.weixin\').val(\'",我获得"\'+p);
                                window.removeEventListener(\'devicemotion\',deviceMotionHandler, false);
                            }else if(d == 3){
                                //$(\'.tit552-4\').fadeIn(300);
                                //$(\'#fanhui\').text(\'您没有中奖..\');
                                $(\'.tit552-3\').siblings().hide();
                                $(\'.tit552-3\').fadeIn(300);
                                window.removeEventListener(\'devicemotion\',deviceMotionHandler, false);
                            }
                            /*else if(d == 4){
                                $(\'.tit552-\'+c).fadeIn(300);
                                $(\'.img51\').fadeOut(300);
                                $(\'.img52\').fadeOut(300);
                                $(\'.weixin\').val(\'",我获得"\'+p);
                            }*/
                        },\'JSON\');
                    }
                last_x = x;
                last_y = y;
                last_z = z;
            }
            return false;
            
        }  
        //摇动 
            
}
    

 

 

<!doctype html>
<html>
<head>
<meta charset="utf-8" />
<meta name="viewport" content="width=device-width,initial-scale=1.0"/>
<title>HTML5 手机摇一摇</title>
<script type="text/javascript">
var color = new Array(\'#fff\', \'#ff0\', \'#f00\', \'#000\', \'#00f\', \'#0ff\');
if(window.DeviceMotionEvent) {
    var speed = 25;
    var x = y = z = lastX = lastY = lastZ = 0;
    window.addEventListener(\'devicemotion\', function(){
        var acceleration =event.accelerationIncludingGravity;
        x = acceleration.x;
        y = acceleration.y;
        if(Math.abs(x-lastX) > speed || Math.abs(y-lastY) > speed) {
            document.body.style.backgroundColor = color[Math.round(Math.random()*10)%6];
        }
        lastX = x;
        lastY = y;
    }, false);
}
</script>
</head>
<body>
HTML 5 手机摇一摇，在手机上运行的。
</body>
</html>