今天要來分享一款很經典的html5遊戲——堆木頭遊戲,這款遊戲的玩法是將木頭堆積起來,多出的部分將被切除,直到下一根木頭無法堆放為止。這款html5遊戲的難點在於待堆放的木頭是移動的,因此需要你很好的控制木頭下落的位置。
實現的**。
html**:
<div
style
="width: 320px; height: 370px;"
>
<
br />
<
div
style
="position: absolute; margin-top: 400px; width: 320px; heigth: 48px; background: #ffffff"
>
div>
<
div
id="alertbox"
>
<
div
id="alertbox_flekk"
>
div>
<
div
id="alertbox_content"
>
div>
div>
<
a id
="button_xwuz"
onclick
="return menuswitch(document.getelementbyid('button_about'));"
ontouchstart
="return menuswitch(document.getelementbyid('button_about'));"
>
a>
<
div
id="imenu"
>
<
a id
="button_game"
href
="#game"
class
="active"
onclick
="return menuswitch(this);"
ontouchstart
="return menuswitch(this);"
><
span
style
="display: none"
>重新開始
span
>
a>
<
a id
="button_highscore"
href
="#highscore"
onclick
="return menuswitch(this);"
ontouchstart
="return menuswitch(this);"
>
<
span
style
="display: none"
>遊戲排行榜
span
>
a>
<
a id
="button_about"
href
=""ontouchstart
="return menuswitch(this);"
><
span
style
="display: none"
>更多遊戲
span
>
a>
div>
<
div
class
="ibox"
id="container"
>
<
div
style
="width: 10000px;"
id="container_scroller"
>
<
div
id="ibox_game"
class
="iboxcontent ibc1"
style
="position: relative;"
>
<
div
style
="width: 237px; height: 15px; overflow: hidden; margin-left: 13px; padding-top: 10px;
font-size: 90%; position: absolute; z-index: 20;"
>
<
div
style
="float: left"
>
<
div
style
="float: left"
id="score_title"
>
得分:
div>
<
div
id="score"
style
="float: left; width: 2em;"
>
0div
>
div>
<
div
style
="float: right"
>
<
div
style
="float: left"
>
連擊:
div>
<
div
id="combo"
style
="float: left; width: 1.5em;"
>
0div
>
div>
<
div
style
="text-align: center"
>
等級:
<
span
id="level"
>1
span
>
div>
div>
<
div
style
="width: 320px; height: 316px; overflow: hidden; position: relative;"
id="st_outerarea"
>
div>
div>
<
div
id="ibox_highscore"
class
="iboxcontent ibc2"
>
<
h3>
您目前的最高分是...
h3>
<
div
id="yourbest"
>
div>
<
p>
一般人努力點可以達到
<
span
class
="fontostext"
>2500
span
> 分, 高手可以達到<
span
class
="fontostext"
>3500
span
>
分. 你可以分享給好友挑戰下
p>
<
p>
你已經玩了
<
span
id="gamesplayed"
class
="fontostext"
>0
span
> 次 <
span
class
="fontostext"
>
堆木頭span
html5遊戲 初試
size medium 我覺得,html5很有前景,移動終端智慧型化 普及是乙個大趨勢,html5的應用有跨平台這一大的優勢,傳統的應用很依賴終端的系統,同樣乙個應用,html5也能實現,它就可以在所有的智慧型終端下使用,而且又有本地儲存,離線使用等特性,這使得它成為未來的主流 用html5開發遊戲...
html5遊戲開發
一 前言 本次教程將向大家講解如何用html5將小地圖塊拼成大地圖,以及如何用現有的高階html5遊戲開發庫件lufylegend.js開發遊戲。首先讓我們來了解了解如何用html5實現動畫,畢竟 動靜結合 是先有動再有靜。看了上一章的內容,或許你就有了對html5實現動畫有了初步了解 二 html...
Html5 移動遊戲開發
有很多遊戲採用h5技術開發,比如三國來了 巴哈姆特之怒 切繩子等。我們公司也有多款遊戲用h5開發,h5開發成本低,效率高,方便做自動更新,可移植性好。受益於h5技術,我們公司的很多產品都很方便跨平台。早在2012年,我就很榮幸負責技術攻關,把我們的遊戲移植到win8和wp8平台,當時在國內的win8...