javascript+css实现俄罗斯方块小游戏
作者:YUN♛ 发布时间:2024-04-23 09:28:06
标签:js,俄罗斯方块
俄罗斯方块,一个很有趣的一个小游戏,此次基于html+css+javaScript实现,包含在一个方块落地后自动生成方块、操控方块的移动以及方块变形等。
部分代码:
<!DOCTYPE html>
<html>
<head>
<meta charset="UTF-8" />
<title>俄罗斯方块 — 经典版V10</title>
<link rel="stylesheet" href="css/tetris.css" />
<style>
.playground{
width: 525px; height: 550px;
margin: 20px auto 0 auto;
position: relative;
background-image:url(../img/tetris.png);
}
.pause{width: 525px; height: 550px;
position: absolute;
top:0;left:0;
background-image:url(../img/pause.png);
z-index:100;
display:none;
}
.playground img{
position:absolute;z-index:10;width:26px;
}
.playground p{
font-size: 30px;
font-family: 'SimHei';
font-weight: bold;
color: #667799;
position: absolute;
left:305px;
top:120px;
}
.playground p+p{top:176px;}
.playground p+p+p{top:232px;}
</style>
</head>
<body>
<div class="playground">
<p>SCORE:<span>0</span></p>
<p>LINES:<span>0</span></p>
<p>LEVEL:<span>1</span></p>
</div>
<script src="js/shape.js"></script>
<script src="js/tetris.js"></script>
</body>
</html>
游戏截图:
源码可参考:js俄罗斯方块
更多有趣的经典小游戏实现专题,分享给大家:
C++经典小游戏汇总
python经典小游戏汇总
python俄罗斯方块游戏集合
JavaScript经典游戏 玩不停
javascript经典小游戏汇总
来源:https://blog.csdn.net/qq_44731369/article/details/106970992
0
投稿
猜你喜欢
- 不敢说得太明显太仔细,反正你懂的。有两种方法,一种是搭建本地授权服务器,另一种是直接替换核心文件,修改对应的注册码。先说第一种。 下载Int
- 本文实例讲述了Python调用系统底层API播放wav文件的方法。分享给大家供大家参考,具体如下:这里未使用其他库,只是使用 pywin32
- 有的时候,操作大文件,或者取数,要很久,我们给脚本首尾添加一段代码就知道,这段代码整体的大致运行时间了。import timestart =
- 当然有,看看下面,你就会明白:<%Sub TimeDelaySeconds(Delay
- 在采集美女站时,需要对关键词进行分词,最终采用的是python的结巴分词方法。中文分词是中文文本处理的一个基础性工作,结巴分词利用进行中文分
- 如下所示:#coding=utf8import csv import logginglogging.basicConfig(level=lo
- 终于完成了偶的拖动窗口,花了近15个小时,庆祝一下(*^__^*);以前写了IE下的功能,于是又写了firefox下的功能,在firefox
- 在刚过去不久的6月30日那天,国外一位在YouTube拥有上千万粉丝的我的世界游戏主播Technoblade因癌症与世长辞,年仅23岁,他并
- 一:命名空间里的namespace关键字和__NAMESPACE__常量的运用PHP支持两种抽象的访问当前命名空间内部元素的方法,__NAM
- 以前我一直用os.system()处理一些系统管理任务,因为我认为那是运行linux命令最简单的方式.我们能从Python官方文档里读到应该
- 代码如下:CREATE DATABASE 临时的 ON ( NAME='临时的_Data', FILENAME='h
- 目录常规思路更快捷的方法使用方法对数据库的表进行重命名可以使用以下原生sql:RENAME TABLE old_table TO new_t
- 长话短说,今天介绍实现此功能的一个方法,需要了解的朋友可以参考下:一、JS 重载页面,本地刷新,返回上一页 代码如下:<a href=
- 说明1、模型集成是指将一系列不同模型的预测结果集成在一起,从而获得更好的预测结果。2、对于模型集成来说,模型的多样性非常重要。Diversi
- Confusion Matrix在机器学习领域,混淆矩阵(confusion matrix),又称为可能性表格或是错误矩阵。它是一种特定的矩
- 本文实例讲述了Python流行ORM框架sqlalchemy安装与使用。分享给大家供大家参考,具体如下:安装http://docs.sqla
- 最近在做python的web开发(原谅我的多变,好东西总想都学着。。。node.js也是),不过过程中总遇到些问题,不管是web.py还是d
- 前言我们在写应用时,基本都会用到配置文件,从各种 shell 到 nginx 等,都有自己的配置文件。虽然这没有太多难度,但是配置项一般相对
- 前言前段时间在一个项目里使用到了分布式锁进行共享资源的访问限制,后来了解到Golang里还能够使用singleflight对共享资源的访问做
- pandas是什么?是它吗?。。。。很显然pandas没有这个家伙那么可爱。。。。我们来看看pandas的官网是怎么来定义自己的:panda