HTML5 tam猫游戏

要的.就是@...... 2019-07-10 10:12:01

<kbd>用html写一个tom猫的小游戏</kbd><!doctype html><html lang="en"><head> <meta charset="utf-8"> <meta name="viewport" content="width=device-width, initial-scale=1.0"> <meta http-equit="X-UA-Compatible" content="ie=edge"> <title>tam猫</title> <style> img:nth-child(1){width:400px;cursor:default;}img:nth-child(1):active{opacity:1;}img{width:80px;position:absolute;cursor:pointer;}img:active{opacity:0.5;} #肚子{ width:100px; height:100px; /* background-color:brown; */ position:absolute; left:155px; top:400px; } #尾巴{ width:40px; height:85px; /* background-color:brown; */ position:absolute; left:275px; top:500px; } #左脚{ width:50px; height:40px; /* background-color:brown; */ position:absolute; left:210px; top:585px; } #右脚{ width:50px; height:40px; /* background-color:brown; */ position:absolute; left:150px; top:590px; } #头{ width:220px; height:220px; /* background-color:brown; */ position:absolute; left:100px; top:115px; } </style> </head> <body> <img src="Resource/Animations/eat/eat_00.jpg" alt=""> <img src="Resource/Buttons/cymbal.png" alt="" onclick="play('cymbal',12)"> <img src="Resource/Buttons/drink.png" alt="" onclick="play('drink',80)"> <img src="Resource/Buttons/eat.png" alt="" onclick="play('eat',39)"> <img src="Resource/Buttons/fart.png" alt="" onclick="play('fart',27)"> <img src="Resource/Buttons/pie.png" alt="" onclick="play('pie',23)"> <img src="Resource/Buttons/scratch.png" alt="" onclick="play('scratch',55)"> <div id="肚子" onclick="play('stomach',33)"></div> <div id="尾巴" onclick="play('angry',25)"></div> <div id="左脚" onclick="play('foot_left',29)"></div> <div id="右脚" onclick="play('foot_right',29)"></div> <div id="头" onclick="play('knockout',80)"></div> </body> <script> var imgs =document.getElementsByTagName('img'); for(var i=1;i<7;i++){ var img=imgs[i]; img.style.left=parseInt(i/4)*300+20+"px"; img.style.top=((i+2)%3+3)*100+"px";} var tomImg=imgs[0]; var playing=false; function play(name,number){if(playing==true){return;}var count=0;playing=true;function eatshow(){count++;if(count<10){count="0"+count;}tomImg.src="Resource/Animations/"+name+"/"+name+"_"+count+".jpg";if(count<number){setTimeout(eatshow,100);}elseplaying=false;}} eatshow; } </script> </htm

...全文

32 2 打赏收藏转发到动态举报

写回复

用AI写文章

2 条回复

切换为时间正序

请发表友善的回复…

发表回复

要的.就是@...... 2019-07-11

打赏
举报

好的，我会继续认真改进的

潇湘忆梦 2019-07-11

打赏
举报

提两个小建议哈，
1. 代码写的有点乱，<script>最好还是写在body里面，不要写在body和html之间

2.script文件里面的调用，是不是有点问题呢，play(name, number)嵌套eatshow() 莫不如把eatshow() 拿出来放在play(name, number)平级

前端开源库-tam谭，谭是你的资产经理。

ibm tam完全安装配置手册，傻瓜式教程，每一步都有详细截图，方便使用！

如何利用TAM的API进行应用的开发.doc

DCCE-TAM4000说明文档pdf,DCCE-TAM4000说明文档

IBM TAM TIM step by step lab(从安装到配置应用尽有) best practise