<!DOCTYPE html>
<html>
<head>
<meta http-equiv="Content-Type" content="text/html; charset=utf-8" />
<script type="text/javascript" src="jquery-1.4.2.js"></script>
<title>让熊动起来</title>
<script type="text/javascript">
var backgroundImg=new Image();
var mushroomImg=new Image();
//定义一个熊
var bearEyesClosedImg=new Image();
var speed=2;//开始的速度
var horizontalSpeed=speed;//水平速度
var verticalSpeed=-speed;//垂直速度
var bearAngle=2;//熊旋转速度
var ctx;
var screenWidth;
var screenHeight;
//定义游戏物体对象
function GameObject(){
this.x=0;
this.y=0;
this.image=null;
}
function Mushroom(){};
Mushroom.prototype=new GameObject();//继承GameObject
//定义一个熊Amimal继承GameObject
function Animal(){};
Animal.prototype=new GameObject();
Animal.prototype.angle=0;//动物的角度，目前中（即作为动物它在屏幕上旋转退回）
var animal=new Animal();//实例化一个熊
var mushroom=new Mushroom();
function gameLoop(){
//清屏
ctx.clearRect(0, 0, screenWidth, screenHeight);
ctx.save();
//绘制背景
ctx.drawImage(backgroundImg,0,0);
//绘制蘑菇
ctx.drawImage(mushroom.image,mushroom.x,mushroom.y);
animal.x+=horizontalSpeed;
animal.y+=verticalSpeed;
animal.angle+=bearAngle;
ctx.translate(animal.x+(animal.image.width/2),animal.y+(animal.image.height/2));
ctx.rotate(animal.angle*Math.PI/180);
ctx.drawImage(animal.image,-(animal.image.width/2),-(animal.image.height/2));
ctx.restore();
}
function loadImages(){
mushroomImg.src="mushroom.png";
backgroundImg.src="forest1.jpg";
bearEyesClosedImg.src="bear_eyesclosed.png";
mushroom.image=mushroomImg;
animal.image=bearEyesClosedImg;
}
function AddEventHandlers(){
$("#container").mousemove(function(e){
mushroom.x=e.pageX-(mushroom.image.width/2);
});
}
$(window).ready(function(){
AddEventHandlers();
loadImages();
ctx=document.getElementById("canvas").getContext('2d');;
screenWidth=parseInt($("#canvas").attr("width"));
screenHeight = parseInt($("#canvas").attr("height"));
mushroom.image = mushroomImg;
mushroom.x = parseInt(screenWidth/2);// 蘑菇X坐标
mushroom.y = screenHeight - 40;//蘑菇Y坐标
animal.x = parseInt(screenWidth/2);// 蘑菇X坐标
animal.y = screenHeight - 40;//蘑菇Y坐标
setInterval(gameLoop, 10);
});
</script>
</head>
<body>
<div id="container" style="border:1px solid; cursor:none; width:480px; height:320px;">
<canvas id="canvas" width="480" height="320" >
</canvas>
</div>
</body>
</html>
分享到：
相关推荐
【标题】"蘑菇游戏_让熊动起来"是一款互动性的网页游戏，可能是一个基于JavaScript和HTML5技术构建的项目。这个游戏的核心目标可能是让一个熊角色通过某种方式移动，比如点击或触碰，来与环境中的蘑菇进行互动。从...
这个“js游戏引擎phaser示例：吃蘑菇游戏”是一个基于Phaser.js开发的互动小游戏，它展示了如何利用该引擎创建一个简单的游戏场景，包括角色控制、碰撞检测以及用户交互。 首先，我们从“game.html”文件入手，这是...
HTML5小游戏源码下载，JS小游戏源码下载，坦克大战，驴子跳，连连看，俄罗斯方块，圈泡泡，塔防，太空战舰，愤怒的小鸟，植物大战僵尸，水果忍者，扫雷，超级玛丽，打地鼠，坦克大战，麻将等JS小游戏源码下载，游戏...
总结起来，识别和了解毒蘑菇的种类、毒性以及中毒症状对于公众健康至关重要。在没有专业指导的情况下，避免食用未知蘑菇是最有效的预防策略。同时，科学研究正试图利用这些毒素的特性来推动生命科学的进步。
01HTML5驴子跳游戏（原作者绝对实战开发指南+游戏源码）珍藏版.zip ...04HTML5圈泡泡游戏源码.zip ...11HTML5游戏引擎插件box2d实现小球碰撞叠加.zip ...13HTML5纯代码扫雷游戏实例.zip ...17HMTL5让蘑菇动起来游戏.zip 等......
4. 动画序列：可能包含角色和敌人的动作序列图，如跳跃、跑动、攻击的帧动画，这些是让游戏角色动起来的关键。 5. UI元素：游戏界面的按钮、得分板、生命值显示等，用于增强游戏交互体验。 6. 音效和音乐：虽然...
《cocosCreator塔防游戏源码》是一款基于Cocos Creator引擎开发的塔防类游戏，非常适合初学者进行学习和实践。源码包含了完整的项目结构，包括游戏逻辑、场景设计、角色控制、动画效果等多个关键部分，是理解游戏...
本节课程主题为“魔乐MLDN-JAVA兴趣课堂_超级马里奥01_游戏演示以及知识准备”，旨在通过Java编程语言来实现经典的超级马里奥游戏，以此激发学习者的编程兴趣，同时引入必要的编程知识和技能。 在开始这个项目之前...
Unity3D是一款强大的跨平台3D游戏开发引擎，被广泛应用于游戏制作、虚拟现实(VR)、增强现实(AR)等领域。在这个“Unity3D模型-各种石头、蘑菇、小草、树木的模型合集”中，包含了丰富的环境元素，为创建生动、真实的...
此外，草方块还有可能隐藏着其他有趣的游戏物品，如花朵、蘑菇或随机生成的种子，增加了游戏的探索性。 总的来说，草方块3D动画是《我的世界》中不可或缺的一部分，它体现了游戏设计者对细节的关注和对玩家体验的...
这些怪物素材可用于创建互动元素，让玩家在游戏中体验到与马里奥对战的乐趣。 除了这些核心元素，素材包可能还包含其他辅助元素，如道具（蘑菇、星星、花）、背景元素（云朵、草地、水管）以及游戏界面元素（得分板...
《马里奥经典》通过逐渐增加关卡复杂度和引入新元素，如隐藏路径、敌人类型，保持了游戏的新鲜感和挑战性，同时避免一开始就让玩家感到挫败。 在前端技术中，优化也是非常重要的一环。为了保证游戏在各种设备上都能...
地图瓦片是构建游戏场景的基础元素，它们是小块图形，组合起来可以形成各种地形，如草地、水管、云层等。这些瓦片设计巧妙，通过不同的排列组合，可以创造出丰富多变的游戏世界。人物则包括主角马里奥和他的兄弟...
游戏中的背景音乐和音效，如跳跃声、吃到蘑菇的声音等，都需要利用这个API实现。 七、优化与性能 1. **帧率控制**：为了保证游戏流畅，开发者需要对游戏循环进行优化，确保帧率稳定。 2. **内存管理**：有效管理...
通过分析源代码，你将能深入了解C++如何用于游戏开发，以及如何将复杂的逻辑和视觉元素结合起来创造一个互动的游戏世界。不过，由于提供的文件名称列表只有一个“hweibin”，没有具体的源代码文件，所以无法深入探讨...
**JavaScript开发单机网页版马里奥小游戏** 在本文中，我们将深入探讨如何使用JavaScript语言...这个项目不仅能锻炼JavaScript编程技能，也能让你了解游戏开发的基本流程，对于初学者来说是一个非常有价值的实践项目。
总结起来，【FC超级马里奥全套素材】是一份全面的游戏开发资源，包括图形、音效、地图、逻辑等多个方面，对游戏开发者尤其是热衷于复古游戏风格的人来说，是一个宝贵的参考资料和创意起点。通过理解和运用这些素材，...
在《超级玛丽》中，经典的8位音乐旋律和各种角色互动的声音（如踩到蘑菇、吃到星星、跳起来等）极大地增强了游戏的趣味性和交互性。对于新手开发者来说，理解如何在游戏引擎中导入和播放这些音频文件，以及如何根据...
不同形态（状态）如小马里奥、超级马里奥、火焰马里奥等，游戏中的特定事件（如吃到蘑菇、花或遇到怪物）触发状态之间的转换，并可能伴随着积分的增减（动作）。状态机的转换可以通过状态转移图来表示，这个图清晰地...