บทความนี้อธิบายถึงซอร์สโค้ดของดาบพลิกของ JS Mini-Game ซึ่งเป็นซอร์สโค้ดที่ยอดเยี่ยมมากของเกม แบ่งปันสำหรับการอ้างอิงของคุณ รายละเอียดมีดังนี้:
1. การแนะนำเกม:
นี่คือเกมจับคู่ฟลอพที่มีทั้งหมดสิบระดับ
1. เกมแบบสุ่มใช้ไพ่ 9 ใบจากไพ่ 42 ใบที่จะเล่นแต่ละกลุ่มจะมีไพ่ 2 ใบมีทั้งหมด 18 ใบ
2. การเปลี่ยนเป็นสองคนที่เหมือนกันติดต่อกันเป็นชัยชนะ เมื่อทั้ง 9 กลุ่มหันมาคุณจะผ่าน หากคุณไม่หันไปหาสองภาพติดต่อกันคุณต้องเปิดอีกครั้ง
3. เกมมี 10 ระดับและจะประสบความสำเร็จในการท้าทายภายในเวลาที่กำหนด
4. หากระดับไม่ผ่านภายในเวลาที่กำหนดเกมจะดำเนินการต่อจากระดับปัจจุบัน
5. รูปภาพการ์ดและเพลงในเกมเป็นเจ้าของโดย Daewoo
6. ต้องใช้เบราว์เซอร์ที่รองรับ HTML5, Chrome และ Firefox ดีที่สุด
รูปภาพเกม:
คลิกที่นี่เพื่อดาวน์โหลดรหัสตัวอย่างที่สมบูรณ์
2. JavaScript Part:
/** เกมพลิกดาบนางฟ้า* วันที่: 2013-02-24* ผู้แต่ง: fdipzone* ver 1.0*/window.onload = function () {var gameimg = ['images/start.png', 'images/success.png', 'images/fail.png', 'ภาพ/clear.png', 'ภาพ' สำหรับ (var i = 1; i <= card.get_total (); i ++) {gameimg.push ('รูปภาพ/การ์ด' + i + '.jpg'); } var callback = function () {card.init (); } img_preload (gameimg, callback);}/** card class*/var การ์ด = (ฟังก์ชั่น (ทั้งหมด, cardnum) {var gametime = [0,65,60,55,50,45,40,35,30,30,25,2025,2025,25,20]; LEVELDATA = []; / เริ่มต้นเกม = function () {reset (); Turnall (); i <= ทั้งหมด; i ++) {carddata.push (i); } // วาดการ์ดสำหรับ (var i = 0; i <n; i ++) {var curcard = carddata.splice (math.random ()*carddata.length, 1) .pop (); LevelData.push ({'Cardno': Curcard, 'Turn': 0}, {'Cardno': Curcard, 'Turn': 0}); } // สร้างการ์ดเกมสั่งซื้อแบบสุ่ม LevelData = Shuffle (LevelData); } // สร้างการ์ดแสดง = function () {var cardhtml = ''; สำหรับ (var i = 0; i <levelData.length; i ++) {cardhtml+= '<div>'; cardhtml + = '<div id = "การ์ด' + i + '">'; cardhtml + = '<div> <img src = "images/card' + leveldata [i] ['cardno'] + '.jpg"> </div>'; cardhtml += '<div> <img src = "images/cardbg.jpg"> </div>'; cardhtml += '</div>'; cardhtml += '</div>'; } sethtml ('gameplane', cardhtml); } // flip all turnall = function () {สำหรับ (var i = 0; i <levelData.length; i ++) {turn_animate (i); }} // flip animation turn_animate = function (คีย์) {var obj = $ _tag ('div', 'การ์ด' + คีย์); var cardfont, cardback; if (getClass (obj [0]). indexof ('out')! =-1) {cardfont = obj [0]; cardback = obj [1]; } else {cardfont = obj [1]; cardback = obj [0]; } setClass (cardback, 'รายการพลิกออก'); var et = settimeout (function () {setclass (cardfont, 'รายการพลิกใน');}, 225); } // ตั้งค่าคลิกเหตุการณ์ set_event = function () {var o = $ _tag ('div', 'gamePlane'); สำหรับ (var i = 0, count = o.length; i <count; i ++) {ถ้า (getClass (o [i]) == 'การ์ด Viewport-flip') {o [i] .onclick = function () {turn (this.id); }}}} // กระบวนการเริ่มต้น = function () {is_lock = 0; var curtime = gametime [ระดับ]; sethtml ('livetime', curtime); var et = setInterval (function () {ถ้า (matchnum == cardnum) {clearinterval (et); return;} curtime-; sethtml ('livetime', curtime); ถ้า curtime == 0) {clearInterval (et); is_over = 1; } // ข้อความข้อความภาพเคลื่อนไหว = ฟังก์ชั่น (ประเภท, การโทรกลับ) {is_lock = 1; ข้อความ var = $ ('ข้อความ'); VAR ประมวลผล = 0; var opacity = 0; VAR TimeTime = {'Start': 1500, 'Success': 4000, 'Fail': 6000, 'Clear': 4000}; disp ('ข้อความ', 'show'); setClass (ข้อความ, 'message_' + ประเภท); SetOpacity (ข้อความความทึบ); setPosition (ข้อความ 'ซ้าย', 0); setPosition (ข้อความ, 'top', 390); if (type == 'start') {bgsound (type, true); } else {bgsound (ประเภท); } var et = setInterval (function () {var message_left = getPosition (ข้อความ, 'ซ้าย'); ประมวลผล = ประมวลผล + 25; ถ้า (ประมวลผล> = 500 && ประมวลผล <= 750) {opacity = opacity + 10; ประมวลผล <= type [type] +250) {opacity = opacity-10; }}}, 25); } // flop turn = function (id) {ถ้า (is_lock == 1) {return; } var key = parseInt (id.replace ('การ์ด', '')); if (levelData [key] ['turn'] == 0) {// ไม่เปิดถ้า (แรก ==-1) {// turn_animate แรก (คีย์); ครั้งแรก = key; LevelData [key] ['turn'] = 1; } else {// second turn_animate (คีย์); LevelData [key] ['turn'] = 1; check_turn (กุญแจ); }}} // ตรวจสอบว่า flop นั้นประสบความสำเร็จในการตรวจสอบ _turn = ฟังก์ชั่น (คีย์) {is_lock = 1; if (LevelData [First] ['Cardno'] == LevelData [key] ['cardno']) {// สำเร็จ matchnum ++; if (matchNum == cardnum) {var et = settimeout (function () {ข้อความ ('ความสำเร็จ', levelup);}, 225); } first = -1; is_lock = 0; } else {// การจับคู่ล้มเหลว, พลิกการ์ดที่เปิด var et = settimeout (function () {turn_animate (ครั้งแรก); levelData [ครั้งแรก] ['turn'] = 0; turn_animate (key); levelData [key] ['turn'] = 0; }} // ระดับระดับผ่านระดับ = ฟังก์ชัน () {ถ้า (ระดับ <gametime.length-1) {ระดับ ++; sethtml ('ระดับ', ระดับ); เริ่ม(); } else {clear (); }} // ผ่านทั้งหมด clear = function () {level = 1; disp ('levelplane', 'ซ่อน'); disp ('กระบวนการ', 'ซ่อน'); sethtml ('gameplane', ''); ข้อความ ('ชัดเจน', init); } // การเล่นเพลง bgsound = function (ไฟล์, วนซ้ำ) {var id = 'Audioplayer'; if (typeof (ไฟล์)! = 'undefined') {ถ้า (typeof (loop) == 'undefined') {loop = false; } var audiofile = []; AudioFile ['MP3'] = 'Music/' + File + '.mp3'; AudioFile ['OGG'] = 'Music/' + File + '.Ogg'; เครื่องเสียง (ID, Audiofile, Loop); } else {AudioPlayer (ID); }} // เคล็ดลับการเล่นเกม = ฟังก์ชั่น (ประเภท) {disp ('เคล็ดลับ', ประเภท); } // รับจำนวนบัตรทั้งหมด get_total = function () {return total; } // รีเซ็ตพารามิเตอร์รีเซ็ต = function () {disp ('levelplane', 'show'); sethtml ('ระดับ', ระดับ); disp ('กระบวนการ', 'show'); sethtml ('livetime', ''); sethtml ('gameplane', ''); is_lock = 1; is_over = 0; ครั้งแรก = -1; matchNum = 0; } ส่งคืนสิ่งนี้;}) (42,9);ฉันเชื่อว่าคำอธิบายในบทความนี้จะมีค่าอ้างอิงบางอย่างสำหรับการเรียนรู้ของทุกคนเกี่ยวกับการออกแบบเกม JavaScript