Html5游戏开发之乒乓Ping Pong游戏示例(三)

ttx9n · 发表于 2013-1-21 14:19:47

我们已经用jQuery初始化了球拍。现在我们做一个如何使用jQuery安置游戏元素,用网格背景来检查我们游戏的元素位置的实验，感兴趣的朋友可以了解下，祝大家游戏开发快乐 jQuery 介绍
【这部分就不翻了，网上有很多的。如果有不懂的部分找度娘】
用jQuery操作游戏元素
我们已经用jQuery初始化了球拍。现在我们做一个如何使用jQuery安置游戏元素的实验。
动起来-使用jQuery修改元素的位置
让我们用网格背景来检查我们游戏的元素位置：
1、我们继续使用PingPong示例。
2、从这里下载我们需要的网格背景图片。
3、在练习目录下创建一个名字叫images的文件夹。
4、将下载的图片放置到jimages文件夹里。这个图片将有助于我们以后检查像素的位移。
5、接下来，在编辑器里打开index.html.
6、修改playground DIV的background属性如下，使它包含像素网格图片。

复制代码代码如下:
#playground{
background: #e0ffe0 url(images/pixel_grid.jpg);
width: 400px;
height: 200px;
position: relative;
overflow: hidden;
}

7、现在在浏览器里打开index.html，我们应该看到的应该想以下截图：一个网格覆盖在游戏背景上，我们现在能看到所有元素的位置了

2013121141431881.jpg

发生了什么？
为方便调试，我们放置了一个叫pixel_grid.jpg的图片到背景上。这张图片有许多小网格，每10x10个网格组成一个100x100像素的大块。通过这张图像，我们就有了一把尺子，让我们能衡量元素在屏幕上的位置。

shw5ovr · 发表于 2022-9-13 12:06:00

飞飞飞飞飞飞飞飞飞飞飞飞飞

i3x3r3 · 发表于 2022-12-19 00:45:15

啦啦啦啦啦啦啦啦啦啦啦啦啦啦啦啦啦啦啦啦啦啦啦啦啦啦啦啦啦啦啦啦啦啦啦啦啦啦啦啦啦啦啦啦啦啦啦啦啦啦啦啦啦

Alisaliu · 发表于 2022-12-25 11:36:52

老衲笑纳了

r8st9 · 发表于 2023-1-27 09:13:51

啦啦啦啦啦啦啦啦！

kwzc65wdj · 发表于 2023-4-10 00:36:16

不错的源码论坛

回复用户1 · 发表于 2023-6-25 23:42:47

怕怕怕怕怕怕怕怕怕怕怕怕怕怕

ki9ku6 · 发表于 2024-4-13 20:40:59

哈哈哈哈哈哈哈

q42obh · 发表于 2024-5-5 14:09:08

谢谢下载来看看

w18pvaep · 发表于 2024-5-7 19:56:21

那三门，你们谁寂寞才快乐撒

账号		自动登录	找回密码
密码			立即注册

[html5] Html5游戏开发之乒乓Ping Pong游戏示例(三)

相关帖子