HTML5汽车赛道飙车游戏免费源码下载

2021-08-23 17:05:36 浏览数 (1)

HTML5汽车赛道飙车游戏

HTML5汽车赛道飙车游戏代码免费下载: https://download.csdn.net/download/qq_44273429/14017244

简介:H5精品短跑赛车俱乐部游戏,赛车游戏源代码。游戏介绍:鼠标,键盘左右键,控制赛车方向,让我们开始赛车比赛游戏吧。兼容手机移动端(横屏模式效果更好,左右晃动控制方向),带背景音效。项目虽简易,供大家学习和参考使用。

项目结构:

index.html代码:

代码语言:javascript复制
<!DOCTYPE html>
<html lang="en">
<head>
<meta charset="utf-8">
<meta name="apple-mobile-web-app-capable" content="yes" />
<meta name="HandheldFriendly" content="True">
<meta name="apple-touch-fullscreen" content="yes" />
<meta name="viewport" content="initial-scale=1.0,maximum-scale=1.01, minimal-ui" />
<title>HTML5汽车赛道飙车游戏</title>
<meta name="keywords" content="HTML5,汽车赛道,飙车游戏" />
<meta name="description" content="HTML5汽车赛道飙车游戏代码下载。H5精品短跑赛车俱乐部游戏,赛车游戏源代码。游戏介绍:鼠标,键盘左右键,控制赛车方向,让我们开始赛车比赛游戏吧。兼容手机移动端(横屏模式效果更好,左右晃动控制方向),带背景音效。" /> 
<meta name="author" content="js代码(www.jsdaima.com)" />
<meta name="copyright" content="js代码(www.jsdaima.com)" />
<style>
		body {
			margin: 0px;
			padding: 0px;
			width: 100%;
			background-color:black;
		}	

		canvas {	
			-ms-touch-action: none;
			image-rendering: -o-crisp-edges;           
			image-rendering: optimize-contrast;        
			-ms-interpolation-mode: nearest-neighbor;  
			-webkit-tap-highlight-color: rgba(0,0,0,0);
			-moz-tap-highlight-color: rgba(0,0,0,0);
			tap-highlight-color: rgba(0,0,0,0);
			user-select: none;
			-webkit-touch-callout: none;
			-webkit-user-select: none;
			-moz-user-select: none;
			-ms-user-select: none;
		} 
	</style>
<script src="viewporter.js"></script>
</head>
<body>
<div id="viewporter">
<canvas id="canvas" moz-opaque></canvas>
</div>
</body>
<script src="TweenMax.min.js"></script>
<script src="howler.js"></script>
<script src="app.js"></script>
</html>

01构造函数添加选择器的支持.html代码:

代码语言:javascript复制
<!DOCTYPE html>
<html lang="en">
<head>
    <meta charset="UTF-8">
    <title>Title</title>
</head>
<body>
    <ul>
        <li>111</li>
        <li>222</li>
        <li>3333</li>
    </ul>
    <script>
        /*
        * jQ整体是一个自调函数,
        * 这个自调函数接收两个参数,第一个是全局对象,第二个是jQ的主体函数,
        * 然后自调函数内间接调用了传入的主体函数,
        * 主体函数对外暴露了两个全局变量$ 与 jQuery。
        * */

        // 1、整体自调
        (function(global, factory){
            factory( global );
        })(window, function(window) {

            // 缓存一些常用的方法,提高查找效率
            var document = window.document;

            var arr = [],
                push = arr.push,
                slice = arr.slice;

            // 3、定义工厂函数
            var jQuery = function(selector) {
                return new jQuery.fn.init(selector);
            }

            // 4、给原型起一个简称,添加原型上添加一些核心成员
            jQuery.fn = jQuery.prototype = {
                construcotr: jQuery
            }

            // 5、定义构造函数,顺带把构造函数添加到工厂的原型中
            var init = jQuery.fn.init = function(selector) {
                [].push.apply(this, document.querySelectorAll(selector));
            };

            // 6、把构造函数的原型替换为工厂的原型,保持一致;
            // 这样init实例就可以使用工厂原型的方法了
            init.prototype = jQuery.fn;

            // 7、添加一个组织整体结构的extend方法
            jQuery.extend = jQuery.fn.extend = function() {
                var arg = arguments, argLen = arg.length;
                var i = 1, key;
                var target = arg[0];

                // 如果参数为1,copy给this
                if(argLen === 1) {
                    target = this;
                    i = 0;
                }

                // 遍历每一个被copy的对象
                for(; i < argLen; i  ) {
                    // 遍历得到对象的属性,copy给target
                    for(key in arg[i]) {
                        if(arg[i].hasOwnProperty(key)) {
                            target[key] = arg[i][key];
                        }
                    }
                }

                return target;
            };

            // 2、主体函数暴露全局变量
            window.jQuery = window.$ = jQuery;
        });
    </script>
    <script>
        console.log($('li'));
    </script>
</body>
</html>

0 人点赞