基于jQuery實現自由打亂次序拼圖游戲



85 338 113



特效描述:基于jQuery實現 自由打亂次序 拼圖游戲,基于jQuery實現自由打亂次序拼圖游戲

代碼結構

1. 引入CSS

<link href="css/zzsc.css" type="text/css" rel="stylesheet" />

2. 引入JS

<script type="text/javascript" src="js/jquery.min.js"></script>
<script type="text/javascript" src="js/zzsc.js"></script>

3. HTML代碼

<div class="wrap">
 <div class="play_wrap">
  <div id="play_area"></div>
   </div>
    <div class="play_menu">
         <a id="play_btn_start" class="play_btn" href="javascript:void(0);" unselectable="on">開始</a>
            <a id="play_btn_level" class="play_btn" href="javascript:void(0);" unselectable="on">
             <span class="level_text">4 x 4</span>
             <span class="level_icon"></span>
            </a>
             <div class="level_menu" id="play_menu_level">
                 <ul>
                     <li>
                         <a href="javascript:void(0);" level=0 >3 x 3</a>
                        </li>
                        <li>
                         <a href="javascript:void(0);" level=1 >4 x 4</a>
                        </li>
                        <li>
                         <a href="javascript:void(0);" level=2 >6 x 6</a>
                        </li>
                    </ul>
                </div>
         <p>完成:<span id="play_score">0</span></p>
         <p>交換:<span id="play_count">0</span></p>
            <p>說明:<br>
            -點擊開始,小圖片將隨機打亂;<br>
            -拖動小圖片可交換位置,順序完全正確則為成功;<br>
            -難度分“3x3”、“4x4”、“6x6”三級;<br>
            -對應的分值為100、200、400;
            </p>
        </div>
</div>
<div style="text-align:center;clear:both">
</div>



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


熱門標簽: 小游戲 H5游戲 游戲源碼 手機游戲 微信游戲 網頁游戲 拼圖游戲 H5拼圖游戲 拼圖游戲源碼
×
×

注冊

官方QQ群

掃描上面二維碼加微信群

官方QQ群

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

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

老夫子电子