HTML5 Canvas Game: "Just Hit The Button

Open In Editor Publish Your Code

<!DOCTYPE html>
<html lang="en">
    <head><base href='https://cdn.jsdelivr.net/gh/faralong/all@main/hitbutton/' /><meta name='robots' content='noindex'>
        <meta http-equiv="X-UA-Compatible" content="IE=edge" />
        <meta name="apple-mobile-web-app-capable" content="yes" />
        <meta name ="viewport" content="width=device-width, initial-scale=1.0, maximum-scale=1.0, user-scalable=0" />
        <meta name="apple-mobile-web-app-status-bar-style" content="black-translucent" />
        <meta charset="utf-8"/>
        <meta http-equiv="pragma" content="no-cache"/>
        
        <style>
            body {
                background: #000000;
                color: #cccccc;
                margin: 0px;
                padding: 0px;
                border: 0px;
				overflow: hidden;
            }
            canvas {
                image-rendering: optimizeSpeed;
                -webkit-interpolation-mode: nearest-neighbor;
                -ms-touch-action: none;
                touch-action: none;
                margin: 0px;
                padding: 0px;
                border: 0px;
            }
			#canvas {
				display: block;
				margin: 0 auto;
			}
			#loading_screen {
				left: 0px !important;
				width: 100%;
				height: 100%;
				object-fit: contain;
			}
            :-webkit-full-screen #canvas {
                width: 100%;
                height: 100%;
            }
            :-webkit-full-screen {
                width: 100%;
                height: 100%;
            } 
        </style>		
    
          <style type="text/css">
            .no-select {
            -webkit-touch-callout: none; /* iOS Safari */
            -webkit-user-select: none; /* Safari */
            -khtml-user-select: none; /* Konqueror HTML */
            -moz-user-select: none; /* Old versions of Firefox */
            -ms-user-select: none; /* Internet Explorer/Edge */
            user-select: none; /* Non-prefixed version, currently supported by Chrome, Edge, Opera and Firefox */
            }
          </style>
        
          <script type="text/javascript">
            setTimeout(function(){
              if(document.getElementsByTagName("canvas").length) {
                document.getElementsByTagName("body")[0].classList.add("no-select")
              }
            }, 2000);
          </script>
          
        </head>
    <body onload="startResizing();">
		<canvas id="canvas" width="1920" height="1080" >
			<p>Your browser doesn't support HTML5 canvas.</p>
		</canvas>
        <script type="text/javascript" src="html5game/Just Hit The Buttonn.js"></script>
        <script>window.onload = GameMaker_Init;</script>
		<script>
			startResizing();
			function startResizing(){
				resizing();
				setInterval(resizing, 1000)
			}
			function resizing(){
				var 
				browserWidth 	= window.innerWidth,
				browserHeight	= window.innerHeight,
				gameWidth		= 1920,
				gameHeight		= 1080,
				scale			= Math.min(browserWidth / gameWidth, browserHeight / gameHeight);
				document.getElementById('canvas').setAttribute("style", "width:" + (gameWidth * scale) + "px");
				document.getElementById('canvas').setAttribute("style", "height:" + (gameHeight * scale) + "px");
				document.getElementById('canvas').style.cursor = 'none';
			}
		</script>
    <script>function fnSendMsg(evt){
          if(typeof window.parent.postMessage == 'function') {
            window.parent.postMessage('keypress-from-game', '*');
          } else if(typeof window.top.postMessage == 'function' && window.top != window.self) {
            window.top.postMessage('keypress-from-game', '*');
          }
        }
        document.body.addEventListener('click', function(event) {
          fnSendMsg(event);
        });
        document.addEventListener('keypress', function(event) {
        	 fnSendMsg(event);
        });
        document.addEventListener('keydown', function (e) {
        	 fnSendMsg(event);
        });
        document.addEventListener('keyup', function (e) {
        	  fnSendMsg(event);
        });
        </script></body>
</html>

HTML5 Canvas Game: "Just Hit The Button

Recommended

Button Hover Animation

Password Generator from TheDoc

button more

HTML

CSS

JS

Recommended

Button Hover Animation

Password Generator from TheDoc

button more

HTMLCopy

CSSCopy

JSCopy

HTML

CSS

JS