Foreword
preface
Chapter 1 Quiz Game 1
1.1 Step One: Question 1
1.2 Step 2: Hidden question 8
1.3 Step Three: Reproduce Question 9
1.4 Step 4: Introduce various program libraries 11
1.5 Step 5: Determine whether the answer chosen by the player is correct 15
1.6 Summary 19
Chapter 2 Text Adventure Game 20
2.1 Step One: Design Page Style 21
2.2 Step 2: Implement page jump 25
2.3 Step 3: Add prop bar and prop drag-and-drop function 27
2.4 Step 4: Add complex interactive functions 35
2.5 Step 5: Add history navigation function 44
2.6 Step 6: Add a wonderful ending 46
2.7 Summary 48
Chapter 3 Party Games 50
3.1 Step One: Create a sample game using atom.js 50
3.2 Step 2: Drawing with canvas element 56
3.3 The third step: Drawing the mouse hole 58
3.4 Step 4: Draw the Mole 60
3.5 Step 5: Put the mole into the mouse hole 63
3.6 Step 6: Make the mole come out of the hole 65
3.7 Step 7: Allow players to fight moles by tapping the keyboard 67
3.8 The [audio] tag of HTML5 is not satisfactory 70
3.9 Summary 72
Chapter 4 Puzzle Game 73
4.1 Step 1: Use easel.js to render 74
4.2 Step 2: Render multiple blocks 78
4.3 Step 3: Create pairs of blocks of the same color 81
4.4 Step 4: Match and eliminate blocks of the same color 83
4.5 Step 5: Hide and flip images 85
4.6 Step 6: Determining the outcome 87
4.7 Step Seven: Caching and Performance Optimization 91
4.8 Step 8: Change the block matching game to a letter recognition game 93
4.9 Summary 99
Chapter 5 Platform Game 100
5.1 First introduction to melon.js 100
5.2 Step One: Create Tile Map 101
5.3 Step 2: Start the game 102
5.4 Step 3: Add game characters 105
5.5 Step 4: Build collision layer 107
5.6 Step Five: Walking and Jumping 108
5.7 Step Six: Title Screen 110
5.8 Step 7: Add items for players to collect 112
5.9 Step 8: Add enemies 113
5.10 Step 9: Add ability-enhancing props 115
5.11 Step 10: Add a victory or defeat determination mechanism and display game information 116
5.12 Summary 118
Chapter 6 Fighting Game 120
6.1 The first step: getting to know game.js 120
6.2 Step 2: Draw each sprite in the sprite sheet individually 123
6.3 Step 3: Process the input of two players 124
6.4 Step 4: Movement and Transformation 127
6.5 Step 5: Don’t let the two players’ inputs block each other 130
6.6 Step 6: Use bit mask to record key status 134
6.7 Step 7: Use mask to detect collision 137
6.8 Step 8: Let the two game characters attack each other 140
6.9 Summary 145
Chapter 7 Flight Shooting Game 146
7.1 Preparatory knowledge related to rendering 146
7.2 The first step: getting to know gameQuery 148
7.3 Step 2: Add “enemy aircraft” 150
7.4 Step Three: Create your own fighter 153
7.5 Step 4: Handling collisions between players and enemies 156
7.6 Step Five: Fire Bullets 157
7.7 Step Six: Provide players with a variety of weapons 159
7.8 Summary 162
Chapter 8 First Person Shooter 164
8.1 The first step: getting to know Jaws 164
8.2 Step 2: Create a two-dimensional map 166
8.3 Step Three: Add Players 169
8.4 Step 4: Use ray casting technology to draw a top view 173
8.5 Step 5: Use light projection technology to achieve pseudo-3D effect 177
8.6 Step 6: Equip players with cameras 180
8.7 Step 7: Decorate the game scene 184
8.8 Step 8: Add companions 188
8.9 Summary 195
Chapter 9 Role Playing Game 197
9.1 The first step: getting to know enchant.js 197
9.2 Step 2: Create a map 199
9.3 Step Three: Add Players 202
9.4 Step 4: Add collision layer 207
9.5 Step 5: Draw status screen 209
9.6 Step Six: Talk to NPC 212
9.7 Step 7: Draw the prop bar 215
9.8 Step 8: Open a prop store 218
9.9 Step 9: Implement the combat interface 226
9.10 Step 10: Store game progress through HTML5’s local storage API 236
9.11 Summary 238
Chapter 10 Real-time Strategy Game 240
10.1 Server 240
10.2 Step One: Configure Node 243
10.3 Step 2: Use socket.io to achieve instant communication 246
10.4 Step 3: Create Isometric map with crafty.js 249
10.5 Step 4: Draw chess pieces 251
10.6 Step 5: Move the pieces 255
10.7 Step Six: Allow players to only control their own chess pieces and hide the patterns on the opponent’s chess pieces 258
10.8 Step 7: Implement collision detection so that players can capture the opponent’s pieces and see their patterns 264
10.9 Summary 268
Chapter 11 How to continue to improve the level of game development 270
11.1 Contents already discussed in this book 270
11.2 What should be learned next 271
Appendix A JavaScript Basics 273
Appendix B Code Quality Control 280
Appendix C Resources 285

Statement of this Website
All resources on this website are contributed and published by netizens, or reprinted by major download sites. Please check the integrity of the software yourself! All resources on this website are for learning and reference only. Please do not use them for commercial purposes, otherwise you will be responsible for all consequences incurred! If there is any infringement, please contact us to delete and remove it. Contact information: admin@php.cn

Related recommendations

Handmade baked food website template

Handmade baked food website template website template is a website template that provides various handmade baked food promotion website templates for download. Tip: This template calls the Google font library, and the page may open slowly.
Front-end template
2023-10-30

Modern artificial intelligence writing service company website template

Modern artificial intelligence writing service company website template is a company promotional website template download that provides artificial intelligence writing services. Tip: This template calls the Google font library, and the page may open slowly.
Front-end template
2023-10-30

Solution planning solution service studio website template

The plan planning solution service studio website template is a company promotional website template download that provides various planning plan services. Tip: This template calls the Google font library, and the page may open slowly.
Front-end template
2023-10-30

Smart Business Consulting Services Company Website Template

Intelligent business consulting service company website template is a company promotional website template download that provides various business consulting services. Tip: This template calls the Google font library, and the page may open slowly.
Front-end template
2023-10-25

IT solution provider promotional website template

IT solution provider promotional website template is a promotional website template download suitable for companies that provide various IT technology solutions. Tip: This template calls the Google font library, and the page may open slowly.
Front-end template
2023-10-25

HTML5 enterprise blockchain service website template

HTML5 enterprise blockchain service website template is a company promotional website template download that provides blockchain services for enterprises. Tip: This template calls the Google font library, and the page may open slowly.
Front-end template
2023-10-24

Indian religious culture education website template

The Indian religious and cultural education website template is a website template download suitable for Indian religious, cultural and educational publicity services. Tip: This template calls the Google font library, and the page may open slowly.
Front-end template
2023-10-24

Minimalist purple style IT solutions company website template

Minimalist purple style IT solution company website template is a website template that provides T solution company promotional website template website template download. Tip: This template calls the Google font library, and the page may open slowly.
Front-end template
2023-10-24

Popular Recommendations

TP5 actual combat_teaching management system whole site source code

This set of tutorials uses a real school teaching management system as an example to teach you step by step how to quickly develop a commercial project using the ThinkPHP5 framework on a piece of white paper, starting from scratch, allowing you to quickly get started with TP5 project development. .

PHP common function summary table

Commonly used functions in PHP, functions that are often used during development

PHP practical Tianlongbabu imitation iQiyi movie website courseware

PHP practical Tianlongbabu imitation iQiyi movie website courseware

TP5 enterprise website development source code

This site's "ThinkPHP5 Enterprise Site Rapid Development Course" package

Thinkphp6.0 official version video tutorial

Thinkphp6.0 official version video tutorial

thinkphp3.2.3 blog template

thinkphp3.2.3 blog template

Courseware related to practical development of general backend management system (Thinkphp6+Layui)

Courseware related to practical development of general backend management system (Thinkphp6+Layui)

ThinkPHP5 mall project practical video tutorial courseware source code

ThinkPHP5 mall project practical video tutorial courseware source code

Day 49~58 teaching source code

Day 49~58 teaching source code

Live class_Blog project source code

Live class_Blog project source code