利用js實現記憶翻牌連連看游戲代碼



23 89 30



特效描述:利用js實現 記憶翻牌 連連看 游戲代碼,利用js實現記憶翻牌連連看游戲代碼

代碼結構

1. 引入CSS

<link href="css/layout.css" type="text/css" rel="stylesheet" />
<link href="css/findpair.css" type="text/css" rel="stylesheet" />
<link href="css/xtiper.css" type="text/css" rel="stylesheet" />

2. 引入JS

<script src="js/findpair.js" type="text/javascript"></script>
<script src="js/xtiper.js" type="text/javascript"></script>

3. HTML代碼

<table class="ftable">
  <tr><td><div id="fbox"></div></td></tr>
</table>
<div class="fbox_btn fbox_btn1">
  <div class="outdiv">游戲規則:翻開兩個格子,如果圖案一致則配對,將其挑出,如果圖案不一致則蓋回去,直到所有格子都配對完成,游戲結束。</div>
</div>
<div class="fbox_btn fbox_btn2">  
  <div id="output"></div>
  <select id="hard" class="hard_select" onChange="changehard()">
    <option value="0">--選擇難度--</option>
    <option value="debug">debug 模式</option>
    <option value="1">難度1: 4x4</option>
    <option value="2">難度2: 6x6</option>
    <option value="3">難度3: 8x8</option>
    <option value="4">難度4: 10x10</option>
  </select>
  <div><button onClick="changehard()">新游戲</button></div>
</div>
<script>
//初始化
fbox = new Findpair('fbox','output');
//開始游戲
fbox.newgame();
//選擇難度
function changehard(obj)
{
  obj = document.getElementById("hard");
  var index = obj.selectedIndex; // 選中索引
  var result = obj.options[index].value; // 選中值
  if(result==0){
    result = fbox.hard ? fbox.hard : 1;
  }
  if(result){
    //修改難度
    fbox.set({
      hard: result,
    });
    //開始游戲
    fbox.newgame();
  }
}
</script>



用戶評論
大牛,別默默的看了,快登錄幫我點評一下吧!:)      登錄 | 注冊


熱門標簽: 旋轉翻轉 旋轉 翻轉 小游戲 H5游戲 游戲源碼 手機游戲 微信游戲 網頁游戲 圖片翻轉 圖片旋轉 連連看 連連看游戲 H5連連看游戲 連連看游戲源碼
?
×
×

注冊

官方QQ群

掃描上面二維碼加微信群

官方QQ群

jQuery/js討論群
群號:642649996
Css3+Html5討論群
群號:322131262

加群請備注:從官網了解到

老夫子电子 棋牌平台排名 华侨城娱乐福利五分彩彩票 20选5复式中奖计算器 微信捕鱼达人赚钱 25选7有多少种 英雄杀刘彻 青海快3在线电子走势图 幸运飞艇软件官方下载 国外图片网站赚钱 围棋技巧口诀图解 福彩开奖查询 福彩七乐彩走势图预测 福彩快3是骗局吗 北京快乐8基本走势图 2017买彩票软件哪个好 陕西快乐10分开奖直播现场