js html5游戏 - 腾讯云开发者社区

文章/答案/技术大牛

发布

学习 Phaser.js HTML5游戏开发-DAY3

DOCTYPE HTML> 万事屋-Phaser.js-Day3 js"> var game = new Phaser.Game(640, 400

1.3K3 0

学习 Phaser.js HTML5游戏开发-DAY2

DOCTYPE HTML> 万事屋-Phaser.js-Day2 学习用phaser.js开发游戏－第二天 js"> var game = new Phaser.Game(640,

1.1K3 0

您找到你想要的搜索结果了吗？

是的

没有找到

学习 Phaser.js HTML5游戏开发-DAY1

，赢百万奖金......了解更多详情>>> Phaser 是目前 Github 上最受欢迎的 H5 游戏框架。...https://github.com/photonstorm/phaser/blob/master/build/phaser.min.js 2. day1.html js"> js"> ...3. day1.js // 1....声明游戏对象 'game' // 前两个参数，800, 600 为游戏界面尺寸 // 第三个参数可以为 Phaser.CANVAS, Phaser.WEBGL, Phaser.AUTO 代表浏览器渲染模式

2K2 0

100行JS实现HTML5的3D贪吃蛇游戏

js1k.com收集了小于1k的javascript小例子，里面有很多很炫很酷的游戏和特效，今年规则又增加了新花样，传统的classic类型基础上又增加了WebGL类型，以及允许增加到2K的++类型，多次想尝试提交个小游戏但总无法写出让自己满意还能控制在这么小的字节范围...自己写不出来，站在巨人肩膀总是有机会吧，想起《基于HTML5的电信网管3D机房监控应用》这篇提到的threejs，babylonjs和Hightopo的几种基于WebGL的3D引擎，突然想挑战下自己实现个...100行JS的3D小游戏，折腾了一番最终采用Hightopo搞了个3D贪吃蛇游戏，算了算JS代码还只有90来行，终于满足了自己的小小心愿写完这篇可以满意去睡觉了。...以下先上一段最终3D游戏在平板上的运行交互视频效果： http://v.youku.com/v_show/id_XNjgxMzIxOTcy.html 传统2D的贪吃蛇游戏一般通过方向键盘控制蛇的前进方向...90来行所有JS源代码如下，各位游戏高手不要喷我，肯定很多人可以写得更精炼，但我只想通过这个玩一玩3D，HTML5和WebGL，包括给整天搞企业应用的自己换换脑子思考些新元素。

2.1K5 0

100行JS实现HTML5的3D贪吃蛇游戏

js1k.com收集了小于1k的javascript小例子，里面有很多很炫很酷的游戏和特效，今年规则又增加了新花样，传统的classic类型基础上又增加了WebGL类型，以及允许增加到2K的++类型，多次想尝试提交个小游戏但总无法写出让自己满意还能控制在这么小的字节范围...自己写不出来，站在巨人肩膀总是有机会吧，想起《基于HTML5的电信网管3D机房监控应用》这篇提到的threejs，babylonjs和Hightopo的几种基于WebGL的3D引擎，突然想挑战下自己实现个...100行JS的3D小游戏，折腾了一番最终采用Hightopo搞了个3D贪吃蛇游戏，算了算JS代码还只有90来行，终于满足了自己的小小心愿写完这篇可以满意去睡觉了。...先上一段最终3D游戏在平板上的运行交互视频效果。...'touchstart' : 'mousedown', 90来行所有JS源代码如下，各位游戏高手不要喷我，肯定很多人可以写得更精炼，但我只想通过这个玩一玩3D，HTML5和WebGL，包括给整天搞企业应用的自己换换脑子思考些新元素

2.4K10 0

HTML5游戏前端开发【秘籍】

QQ空间Android版4.2和4.5上线的玩吧游戏“空间疯狂套牛”是一款使用HTML5开发出的手机游戏，虽然还有很多不足，但其中使用的一些技术与技巧还是很有必要为大家分享出来，方便大家用秘籍打通各种关卡创造出更多更好的...HTML5游戏。...先想到用JS来动态的根据分辨率来设置相关元素的大小，但要么在某些机型中获取失败，要么用赋值缩放相关元素时造成游戏崩溃…… 反反复复折腾良久之后，终于在克强同志宣布沪港通A股H股大升的日子里想到了用 absolute...最终效果如下，无论屏幕怎么变化，都可以非常恰当的显示：二、帧动画好的游戏一定有好的动画，感谢设计师为游戏带来优美的视觉享受，如果在实现时有所折扣那是对设计师工作的不尊重，所以在实现动画这里，我们要谨慎小心...牛的跑动这里我们根据之前在做PC与手机联动的小游戏，如：障碍越野赛、爬花藤、中秋小游戏中积累的经验，再结合手机浏览器主要是webkit内核，这里选用 animation-timing-function

2.3K7 0

HTML5游戏开发实战–当心

这样就使得制作HTML5网络游戏成为可能。 2.随着现代浏览器对HTML5元素的原生支持，将不再须要用户预装第三方插件就能够玩游戏了。...短代码更有利于代码的阅读，这对游戏开发至关重要，由于游戏开发往往包括大量的代码。写短代码能够加快开发速度。使用jQuery库能够让代码无须做额外的调整就能够支持全部主流浏览器。...$( this ).attr ( ” data-pattern ” , pattern ); 对于HTML5自己定义数据属性。...jQuery提供了还有一个函数来訪问HTML5自己定义属性属性，那就是data函数。 data函数最先用于给HTML元素的jQuery对象嵌入自己定义数据。...后来用来訪问HTML5自己定义数据属性。

2.5K1 0

HTML5游戏引擎深度测评

最近看到网上一篇文章，标题叫做《2016年最火的 15 款 HTML5 游戏引擎》。目前针对HTML5游戏的解决方案已经非常多，但谁好谁差却没有对比性资料。...当然，你可以用它来做任何事情，无论是游戏，还是炫酷的3D展示。设计理念 Three.js在设计之处希望创建一个非常轻量级的3D库，能够帮助开发者快速搭建基于HTML5的3D内容。...就像Pixi.js的定位不一样，Phaser的定位是 "Desktop and Mobile HTML5 game framework"，中为称之为“桌面与移动端的HTML5游戏框架”。...Egret定位 Egret算是HTML5游戏引擎中的新起之秀，其定位已不单纯为HTML5游戏引擎。官方将其定位为“游戏解决方案”，同时也并未过多提及HTML5。...不难看出，Egret 和 Cocos2D-js联合瓜分了大部分市场。而Egret占比居然过半，达到58%。看来Egret在国内HTML5游戏市场还是非常强悍的。

8.8K9 1

HTML5小游戏之见缝插针

大家好，又见面了，我是全栈君今天给大家带来的就是一款叫做《见缝插针》的游戏。有空你就往里插，直到你无处可插！看你能过多少关！...简洁大气黑白搭配游戏画面非常的简洁，米白色的背景中央，放置着一个不断旋转的太阳状的球体，周边网状似的放射连接着许多小球，又有点宇宙中星球的感觉，所有球体均以黑色为主，与米白色的背景产生出了鲜明的对比...html; charset=utf-8"/> 虐心小游戏...section> js..."> js">

1.4K2 0

HTML5 游戏引擎深度测评

最近看到网上一篇文章，标题叫做《 2016年最火的 15 款 HTML5 游戏引擎》。目前针对HTML5游戏的解决方案已经非常多，但谁好谁差却没有对比性资料。...当然，你可以用它来做任何事情，无论是游戏，还是炫酷的3D展示。设计理念 Three.js在设计之处希望创建一个非常轻量级的3D库，能够帮助开发者快速搭建基于HTML5的3D内容。...就像Pixi.js的定位不一样，Phaser的定位是 "Desktop and Mobile HTML5 game framework"，中为称之为“桌面与移动端的HTML5游戏框架”。...Egret 定位 Egret算是HTML5游戏引擎中的新起之秀，其定位已不单纯为HTML5游戏引擎。官方将其定位为“游戏解决方案”，同时也并未过多提及HTML5。...不难看出，Egret 和 Cocos2D-js联合瓜分了大部分市场。而Egret占比居然过半，达到58%。看来Egret在国内HTML5游戏市场还是非常强悍的。

6.9K13 2

【教程下载】HTML5游戏开发(全)

点击“蚂蚁HTML5社区”，快速关注，每天一个免费开源程序。 HTML5有望成为网络游戏开发的热门新平台。...HTML5游戏能够运行于包括iPhone系列和iPad系列在内的计算机、智能手机以及平板电脑上。今天，我们加入HTML5游戏开发的急先锋，明日将成为时代的弄潮儿。...本书将展示如何使用最新的HTML5和CSS3 Web标准来构建纸牌游戏、绘图游戏、物理游戏，甚至是多人网络游戏。本书讲解清晰、系统全面，参照本书的讲解就能构建出6款示例游戏。...HTML5、CSS3以及相关的JavaScript API是网络上最新的热点话题。这些标准给我们带来一个新的游戏市场—HTML5游戏。...通过新的功能，我们能用HTML5元素、CSS3属性，以及JavaScript来设计运行于浏览器的游戏。本书根据关注话题的侧重点而分成9章。

3K1 0

畅行HTML5游戏世界——Egret引擎

2015年，HTML5游戏异常火爆，从最初的单机小游戏，到后来的中重度网络游戏如雨后春笋般涌现。随着市场需求的增多，越来越多的开发者投入到HTML5游戏开发行业中来。...在HTML5和移动游戏强大的发展趋势下，Egret引擎应运而生，Egret 引擎专注于移动设备上的HTML5 游戏开发，为HTML5 游戏开发者提供了无可比拟的快捷开发游戏的方式。...跨平台 Egret 本身是用来开发HTML5 页面游戏的，但Egret 引擎早已考虑了广大开发者制作原生游戏的需求，因此提供了Android Support 和iOS Support，使得原本只能在HTML5...环境运行的游戏可以通过简单的步骤生成原生游戏，这种方式底层是用Egret Runtime 一样的机制，因此，打包为原生之后，性能也较HTML5 会有极大的提升。...位图字体为高品质游戏的个性文字效果输出提供了方便快捷的解决方案。 ? 相关图书《Egret—HTML5游戏开发指南》 Egret精粹白鹭引擎诚意之作全面系统海量案例张鑫磊等著

3.9K1 0

HTML5版的String Avoider小游戏

HTML5版的String Avoider小游戏 http://www.newgrounds.com/portal/view/300760 蛮简单也蛮考验耐心，从游戏起始点移动鼠标到终点位置，鼠标移动过程绘制出移动轨迹的...String平滑曲线，整个过程不能碰撞到边界，从技术角度来说其核心就是根据鼠标移动位置生成String线的算法，该游戏是ActionScript写的Flash版，这里将其改造成HTML5版的JavaScript...除了绘制String线外还有个技术点就是监测碰撞，该Flash游戏的边界都是线段，因此第一想到的监测方式就是线线相交的思路，算法可参考 http://en.wikipedia.org/wiki/Line...%E2%80%93line_intersection ，如果以LineLine的相交思路只需要遍历所有point间的线段，判断是否与游戏关卡定义的边界线相交，但这种方式对不规则边界就比较麻烦，监测性能也不高...考虑到我们还需要提供用户可DIY自定义游戏关卡的功能，我们将采用监测颜色透明度信息的方式，由于正常游戏时场景无需用户动态修改，因此边界的信息可提前缓存到ImageData内存中，并且我们300个点的距离都是

1.4K8 0

Phaser 桌面和手机游戏HTML5框架

Phaser是一个流行的2D开源游戏框架，可以用来开发桌面或手机浏览器HTML5游戏，适合侧视或顶视风格： ?...Phaser框架的绝大部分功能，都打包在单一phaser.js文件中。...我们只需要在宿主HTML文件中引入这个框架文件，就可以开始使用Phaser： js"> 几乎所有的框架API，都定义在Phaser命名空间之下...√ 指定游戏尺寸当然，我们可以自行指定游戏的大小。...元素来指定游戏画布的父元素。

4.7K2 0

HTML5版的String Avoider小游戏

1.2K4 0

html5载入JS引用「建议收藏」

importInnerBtnClick”> 载入UI2，符合AMD规范的文件 <a component=” JS...Model.prototype.importOutterBtnClick=function(event){ var path=”http://localhost:8080/cn/wp-content/uploads/2015/04/outterAMD2.js...require([path],function(m){ m.fnOfOutterAMD2(); }) } return Model; }); 须要引用的JS...function(require){ return{ fnOfAMD2:function(){ alert(“hello AMD2”); } }; }); 程序中会出现两个button 引用外部js...文件成功引用网络js文件失败发布者：全栈程序员栈长，转载请注明出处：https://javaforall.cn/116569.html原文链接：https://javaforall.cn

7.7K1 0

HTML5、JS实现元素拖拽排序

先介绍一下html5的drag属性,拖放（Drag 和 drop）是 HTML5 标准的组成部分。

1.5K6 0

js写2048游戏代码

2 2--> js.../jquery-1.8.3.js" type="text/javascript" charset="utf-8"> js/2048.js" type="text

26K3 1

js --斗兽棋游戏

html; charset=utf-8" /> 斗兽棋-by:lalasxc js..."> js"> js"> body{margin:0;padding:0;font-size:14px;} .drag{width:150px.../li> 斗兽棋游戏规则...ev.addEvent(drag,"mousedown",mDown);//让棋子可拖动 } var s_left=0; var s_top=0; var z=1000; //判断游戏规则函数

5.7K6 0

技术干货分享：如何选择 HTML5 游戏引擎

另外，不能在浏览器中直接运行的JS引擎，将限制H5游戏跨平台的交互能力。还有，笔者非常看好webGL模式，认为webGL模式才是H5引擎的未来。...在webGL的2D渲染性能方面，pixi.js的性能处于当前的顶级。在webGL的3D渲染性能方面，Three.js非常优秀。...在runtime方面Cocos2d-js也有着原生级的表现，经过对比，笔者认为Layabox性能的综合实力最强，在各个渲染领域都保持在HTML5引擎的顶级水平。...发布PC页游时，由于PC浏览器目前对HTML5兼容性不足70%，用户损耗很大，页游联运平台可能会拒绝或放量很少，只有采用能同时发布Flash版本的引擎，才能解决这个问题。 ?...那么2D游戏，pixi.js无疑是首选。3D游戏，笔者推荐Three.js。但是这两种引擎的学习资料都比较稀少。

2.7K9 0

点击加载更多

学习 Phaser.js HTML5游戏开发-DAY3

学习 Phaser.js HTML5游戏开发-DAY2

学习 Phaser.js HTML5游戏开发-DAY1

100行JS实现HTML5的3D贪吃蛇游戏

100行JS实现HTML5的3D贪吃蛇游戏

HTML5游戏前端开发【秘籍】

HTML5游戏开发实战–当心

HTML5游戏引擎深度测评

HTML5小游戏之见缝插针

HTML5 游戏引擎深度测评

【教程下载】HTML5游戏开发(全)

畅行HTML5游戏世界——Egret引擎

HTML5版的String Avoider小游戏

Phaser 桌面和手机游戏HTML5框架

HTML5版的String Avoider小游戏

html5载入JS引用「建议收藏」

HTML5、JS实现元素拖拽排序

js写2048游戏代码

js --斗兽棋游戏

技术干货分享：如何选择 HTML5 游戏引擎

相关资讯

热门标签

活动推荐

运营活动

社区

活动

圈层

关于

腾讯云开发者

热门产品

热门推荐

更多推荐