이 기사는 JS 미니 게임의 소스 코드의 소스 코드에 대해 설명합니다.이 게임은 게임의 매우 훌륭한 소스 코드입니다. 참조를 위해 공유하십시오. 세부 사항은 다음과 같습니다.
1. 게임 소개 :
이것은 총 10 레벨의 플롭 페어링 게임입니다.
1.이 게임은 42 장의 카드에서 9 장의 카드를 끌어 올리며 각 그룹은 2 개의 카드로 총 18 장의 카드입니다.
2. 두 개의 동일한 것을 연속으로 돌리는 것은 승리입니다. 9 개의 그룹이 모두 회전하면 통과합니다. 두 개의 연속 사진으로 돌아 가지 않으면 다시 돌려야합니다.
3. 게임은 10 레벨을 가지고 있으며 지정된 시간 내에 도전에 성공할 것입니다.
4. 지정된 시간 내에 레벨이 전달되지 않으면 게임은 현재 레벨에서 계속됩니다.
5. 게임의 카드 사진과 음악은 Daewoo가 소유하고 있습니다.
6. HTML5를 지원하는 브라우저가 필요합니다. 크롬 및 파이어 폭스가 최고입니다.
게임 사진 :
전체 예제 코드를 다운로드하려면 여기를 클릭하십시오.
2. JavaScript 부분 :
/** Fairy Sword Flip 게임* 날짜 : 2013-02-24* 저자 : FDIPZONE* VER 1.0*/WINDOM.ONLOAD = function () {var gameImg = [ 'images/start.png', 'images/success.png', 'images/fail.png', 'images/clear.png', 'image/cardbg.jpg', 'image/sword'; for (var i = 1; i <= card.get_total (); i ++) {gameimg.push ( 'images/card' + i + '.jpg'); } var callback = function () {card.init (); } img_preload (gameimg, 콜백);}/** card class*/var card = (function (total, cardnum) {var gametime = [0,65,60,55,45,45,40,35,30,25,20,20]; // 레벨 당 var 턴 타임 = 8; // var var var var var var var var var var var var var var var var var var var var var var var var var var var var var var var var var var var var var var var var var var var var var var var var var var var var var var var var. LevelData는 var is_over = 0; 게임 start = {)는 show (); turnall ()} curtime-; 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 = 셔플 (levelData); } // 카드 생성 카드 show = function () {var cardhtml = ''; for (var i = 0; i <levelData.length; i ++) {cardhtml+= '<div>'; cardhtml + = '<div id = "card' + 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); } // 모든 turnall = function () {for (var i = 0; i <levelData.length; i ++) {turn_animate (i); }} // flip animation turn_animate = function (key) {var obj = $ _tag ( 'div', 'card' + key); 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, 'List Flip Out'); var et = settimeout (function () {setclass (cardfont, 'list flip in');}, 225); } // 클릭 설정 이벤트 set_event = function () {var o = $ _tag ( 'div', 'GamePlane'); for (var i = 0, count = o.length; i <count; i ++) {if (getClass (o [i]) == 'card viewport-flip') {o [i] .onclick = function () {turn (this.id); }}}} // 시간 시작 프로세스 = function () {is_lock = 0; var curtime = gametime [level]; Sethtml ( 'livetime', 큐 타임); var et = setInterval (function () {if (matchnum == cardnum) {clearinterval (et); return;} curtime--; sethtml ( 'livetime', curtime); if (curtime == 0) {clearInterval (et); is_over = 1; 메시지 ( '실패', 시작);}}, 1000); } // 게임 메시지 애니메이션 메시지 = 함수 (유형, 콜백) {is_lock = 1; var message = $ ( 'message'); var 처리 = 0; var 불투명도 = 0; var soundtime = { 'start': 1500, 'success': 4000, 'fail': 6000, 'clear': 4000}; disp ( 'message', 'show'); setclass (메시지, 'message_' + type); setOpacity (메시지, 불투명도); setPosition (메시지, '왼쪽', 0); setPosition (메시지, 'TOP', 390); if (type == 'start') {bgsound (type, true); } else {bgsound (type); } var et = setInterVal (function () {var message_left = getPosition (message, 'left'); processed = processed + 25; if (Processed> = 500 && processed <= 750) {accacity = incacity + 10; setPosition (left ', message_left + 30); setOpacity (메시지, 불투명); <time] {type] {remperation+35); }}, 25); } // flop turn = function (id) {if (is_lock == 1) {return; } var key = parseint (id.replace ( 'card', '')); if (levelData [key] [ 'turn'] == 0) {// if (first == -1) {// First Turn_animate (key); 첫 번째 = 키; levelData [key] [ 'turn'] = 1; } else {// 두 번째 turn_animate (키); levelData [key] [ 'turn'] = 1; check_turn (키); }}} // 플롭이 성공적인지 확인하십시오 check_turn = function (key) {is_lock = 1; if (levelData [first] [ 'cardno'] == levelData [key] [ 'cardno']) {// 성공 matchnum ++; if (matchnum == cardnum) {var et = settimeout (function () {message ( 'success', levelup);}, 225); } 첫 번째 = -1; is_lock = 0; } else {// 페어링 실패, 열린 카드 var et = settimeout (function () {turn_animate (first); levelData [ 'turn'] = 0; turn_animate (key); levelData [ 'turn'] = 0; if (is_over == 0) {is_lock = 0;}}, 300); }} // 패스 레벨 레벨 업 = function () {if (level <gametime.length-1) {level ++; Sethtml ( '레벨', 레벨); 시작(); } else {clear (); }} // 모든 clear = function () {level = 1; disp ( 'levelplane', 'hide'); disp ( 'process', 'hide'); Sethtml ( '게임 플레인', ''); 메시지 ( 'Clear', init); } // 음악 재생 bgsound = function (file, loop) {var id = 'audioplayer'; if (typeof (file)! = 'undefined') {if (typeof (loop) == 'undefined') {loop = false; } var audiofile = []; audiofile [ 'mp3'] = 'music/' + file + '.mp3'; audiofile [ 'ogg'] = 'music/' + file + '.ogg'; Audioplayer (ID, Audiofile, Loop); } else {audioplayer (id); }} // 게임 플레이 팁 = function (type) {disp ( 'tip', type); } // 총 카드 수를 가져옵니다 get_total = function () {return total; } // 매개 변수 재설정 Reset = function () {disp ( 'levelplane', 'show'); Sethtml ( '레벨', 레벨); disp ( 'process', 'show'); Sethtml ( 'livetime', ''); Sethtml ( '게임 플레인', ''); is_lock = 1; is_over = 0; 첫 번째 = -1; matchnum = 0; } reture this;}) (42,9);이 기사의 설명은 모든 사람의 JavaScript 게임 디자인 학습에 대한 특정 참조 값을 가질 것이라고 생각합니다.