第基于JS實現(xiàn)蜘蛛俠動作游戲的示例代碼目錄代碼結(jié)構(gòu)代碼展示HTMLJS項目運行游戲截圖整個游戲源碼是由html、js、css、圖片等代碼完成的，無后端數(shù)據(jù)保存功能。

代碼結(jié)構(gòu)

js文件夾是游戲事件控制文件

vapp文件夾是游戲圖片文件

icon.png是網(wǎng)頁游戲圖標(biāo)

index.html是游戲主頁

代碼展示

HTML

index.html代碼如下：

!DOCTYPEhtmlPUBLIC"-//W3C//DTDXHTML1.0Transitional//EN""/TR/xhtml1/DTD/xhtml1-transitional.dtd"

htmlxmlns="/1999/xhtml"

head

metacharset="utf-8"/

metaname="viewport"content="width=device-width,initial-scale=1.0,maximum-scale=1.0,user-scalable=no"

title蜘蛛俠/title

scripttype="text/javascript"

var_con={};_con["num"]=58;

/script

metaname='robots'content='noindex,follow'/

metaname="format-detection"content="telephone=noemail=no"/

metaname="apple-mobile-web-app-capable"content="yes"/

metaname="apple-mobile-web-app-status-bar-style"content="black"/

metahttp-equiv="X-UA-Compatible"content="IE=edge,chrome=1"/

styletype="text/css"

body{margin:0;-webkit-user-select:none;-webkit-text-size-adjust:none;-moz-user-select:none;

-moz-text-size-adjust:none;-ms-user-select:none;-ms-text-size-adjust:none;

-o-user-select:none;-o-text-size-adjust:none;user-select:none;text-size-adjust:none;

min-height:100%}#g1{margin-top:280px;margin-left:40px;position:absolute}

#weixin-share{background-image:url(./vapp/58/share11.png);height:100px;width:160px;position:absolute;top:0px;left:240px;z-index:699}

#weixin-text{font-family:"MicrosoftYahei",Arial,Helvetica,sans-serif;

height:600px;width:420px;margin-top:0px;margin-right:auto;margin-left:

auto;background-color:#E8D9AE;padding-top:23px;padding-left:40px;

z-index:600}#weixin-text#j{height:464px;width:316px;background-image:url(./vapp/58/j.png);background-repeat:no-repeat;margin:0px;padding:0px;clear:both;position:absolute;z-index:601}#weixin-text

#j#txt{font-size:36px;font-weight:bold;color:#790000;margin-top:110px;margin-left:0px;text-align:center;}#weixin-text

#j#rank{text-align:center;margin-top:0px;position:absolute;width:100%;padding-top:5px;color:#4E4524}

.lis{overflow:hidden;width:100%;z-index:99999;position:absolute;top:0;}

.lisa{display:block;width:99.9%;color:#ffffff;font-size:14px;text-decoration:none;background:#606783;text-align:center;opacity:0.5;line-height:30px;font-weight:bold;font-family:"微軟雅黑"}

.lisaimg{position:relative;top:1px;}

/style

/head

bodybgcolor="#000000"vlink="#7f7f7f"alink="#7f7f7f"link="#7f7f7f"

div

divahref=""rel="externalnofollow"游戲列表/a/div

divahref="/s__biz=MzA4Njg1MjkzOA==mid=200770039idx=1sn=a97ee832189c4b1d5eb9947f7e74e7ad#rd"rel="externalnofollow"關(guān)注收藏/a/div

divahref="javascript:;"rel="externalnofollow"imgwidth="15"src="./vapp/4.png"重玩/a/div

/div

divid="myfbk"

nbsp;

/div

divid="mypriv"

/div

script

vards_info="Climbupaseriesofplatformsusingagrapplinghook.Ifyoufalltheisgameover.";

functioninfo(){

alert(ds_info);

functionds_HS(){}

functionmyshow(){//par_ad2=1;;

functionmydisable(){}

varpar_level;

varpar_score;

varpar_game;

varpar_ad2=1;

varpar_ad3=1;

varpar_ad4=1;

varpar_adx2;

varpar_adx3;

varpar_adx4;

functionds_RZ(){}

functionds_SHS(){

return"";

vardsp=newArray("=0","","/",1,0,0,1,"","/",1,0,0,1,0,"/","/","","",0,250,16,1,"","","","",0,1,0,"",1,1);

varsp_a=6;//max

varsp_b=9;//min

/script

scriptsrc="./js/58/game.js"/script

scriptsrc="./js/58/share.js"/script

scriptlanguage=javascript

varmebtnopenurl='/';

dataForWeixin={

"appId":"",

"imgUrl":"/weixin/zzx/icon.png",

"url":"/weixin/zzx/",

"tTitle":"蜘蛛俠",

"tContent":"蜘蛛俠"

functiongoHome(){

window.location=mebtnopenurl;

functionclickMore(){

goHome();

functiondp_share(){

document.title="我是蜘蛛俠飛躍"+myData.score+"米,高處不勝寒,誰來挑戰(zhàn)我";

document.getElementById("share").style.display="";

dataForWeixin.tTitle=document.title;

functiondp_Ranking(){

window.location=mebtnopenurl;

document.addEventListener('WeixinJSBridgeReady',functiononBridgeReady(){

WeixinJSBridge.on('menu:share:appmessage',function(argv){

WeixinJSBridge.invoke('sendAppMessage',{

"appid":dataForWeixin.appId,

"img_url":dataForWeixin.imgUrl,

"link":dataForWeixin.url,

"desc":dataForWeixin.tContent,

"title":dataForWeixin.tTitle

},onShareComplete);

WeixinJSBridge.on('menu:share:timeline',function(argv){

WeixinJSBridge.invoke('shareTimeline',{

"appid":dataForWeixin.appId,

"img_url":dataForWeixin.imgUrl,

"img_width":"640",

"img_height":"640",

"link":dataForWeixin.url,

"desc":dataForWeixin.tContent,

"title":dataForWeixin.tTitle

},onShareComplete);

},false);

/script

divid=share

imgwidth=100%src="./vapp/58/share.png"

ontouchstart="document.getElementById('share').style.display='none';"/

/div

scripttype="text/javascript"

varmyData={gameid:"zzx"};

functiondp_submitScore(score){

myData.score=score+"0";

myData.scoreName=score+"0"+"米";

if(score0){

if(confirm("你就是蜘蛛俠的化身,竟然飛了"+score+"0"+"米的距離,不可思議!")){

dp_share();

functiononShareComplete(res){

document.location.href=mebtnopenurl;

/script

/body

/html

JS

share.js代碼如下

functionw596_rank(x){

vars='';

vart='神奇蜘蛛俠變態(tài)版';

varx1='';//部門

varx2='';//公職

vary='';//人數(shù)

varz='';//百分比

vararr='';

if(x10000){

x2='超凡蜘蛛俠';

z='99';

y=Math.floor(+Math.random()*713);

elseif(x3000){//特攻隊

arr=