Untitled

<!DOCTYPE html>
<html>
<head>
<meta charset="utf-8">
<meta name="viewport" content="width=device-width, initial-scale=1.0">
<title>微信小游戏</title>
<style>
body{background:#fefefe;margin:0;text-align:center}
#box{width:100%;height:100vh;position:relative}
#player{width:50px;height:50px;background:red;position:absolute;bottom:60px;left:50%;transform:translateX(-50%)}
#score{position:fixed;top:20px;left:20px;font-size:22px;font-weight:bold}
</style>
</head>
<body>
<div id="box">
  <div id="score">得分：0</div>
    <div id="player"></div>
    </div>

    <script>
    let p = document.getElementById("player");
    let s = document.getElementById("score");
    let score = 0;
    let px = window.innerWidth/2;

    document.addEventListener("touchstart",function(e){
          let x = e.touches[0].clientX;
            if(x < window.innerWidth/2) px -= 50;
              else px += 50;
                if(px<30)px=30;
                  if(px>window.innerWidth-30)px=window.innerWidth-30;
                    p.style.left = px + "px";
    });

    function fall(){
          let f = document.createElement("div");
            f.innerText = "🧧";
              f.style.cssText = "position:absolute;left:"+(Math.random()*(window.innerWidth-40))+"px;top:0;font-size:30px";
                box.appendChild(f);
                  
                    let t = setInterval(()=>{
                            let y = parseInt(f.style.top)||0;
                                f.style.top = y+8+"px";
                                    if(y>window.innerHeight-100 && Math.abs(parseInt(f.style.left)-px)<60){
                                              score+=10; s.innerText="得分："+score;
                                                    f.remove(); clearInterval(t)
                                    }
                                        if(y>window.innerHeight){f.remove();clearInterval(t)}
                    },30)
    }
    setInterval(fall,1000);
    </script>
    </body>
    </html>
    
                                    }
                    })
    }
    })
Editor is loading...