Web Designer Pro Bundle - $500 of Site Templates, Stock Photos, Code, Graphics and more for only $20

Browsing Category

HTML5

Build an HTML5 MP3 Player With SoundManager 2 – Tuts+ Premium
plus

Build an HTML5 MP3 Player With SoundManager 2 – Tuts+ Premium

It’s time for another Premium tutorial! This week, James Tyner will walk you through the process of building an HTML5 MP3 player, step by step, with the SoundManager 2 library, jQuery, and a little help from Flash (for extra audio functionality).

Create an HTML5 Canvas Tile Swapping Puzzle

Create an HTML5 Canvas Tile Swapping Puzzle

In this tutorial we will be working with the HTML5 canvas and Javascript to create a dynamic tile swapping game. The result will be a puzzle that works with any given image, and has flexible difficulty levels that are easily adjusted.

Create a Pong Game in HTML5 With EaselJS – Tuts+ Premium
plus

Create a Pong Game in HTML5 With EaselJS – Tuts+ Premium

It’s Premium tutorial time! This week, Tuts+ members will learn how to use the EaselJS JavaScript library (along with SoundJS and TweenJS) to create a version of the classic Pong game in HTML5.

An Introduction to the HTML5 Gamepad API

An Introduction to the HTML5 Gamepad API

As HTML games begin to gradually increase in popularity, vendors are starting to introduce some exciting new APIs to make gaming that little bit sweeter for both us developers and our end players. One of these is the GamepadAPI, which allows you to connect your good old console gamepad into your computer and use it for browser based games, plug and play style. Let’s dive in!

Create a Whack-a-Mole Game in HTML5 With EaselJS – Active Premium
plus

Create a Whack-a-Mole Game in HTML5 With EaselJS – Active Premium

A couple of months ago, Carlos showed Premium members how to create a Whack-a-Mole game using Flash and AS3. Now, following on from Monday’s introduction to EaselJS, he’ll explain how to use that library to create the same game with the HTML5 canvas and JavaScript.

Getting Started With EaselJS: A Flash-Like Interface for the HTML5 Canvas

Getting Started With EaselJS: A Flash-Like Interface for the HTML5 Canvas

There’s been some resistance from Flash developers to our new HTML5 content. In this article – aimed at experienced AS3 coders – we’ll look at EaselJS, a JavaScript library that makes working with the HTML5 canvas very similar to working with the Flash display list.

HTML5 Avoider Game Tutorial: Keeping Score
basix

HTML5 Avoider Game Tutorial: Keeping Score

This entry is part 3 of 3 in the series HTML5 Avoider Game Tutorial

So far, we’ve got a never-ending stream of enemies that our avatar must avoid; one touch, and it’s game over. But so what? Since there’s no way to track the player’s progress, they have no idea whether they did better in their latest round than they ever did before. In this tutorial, you’ll learn how to keep score, how to display it on the canvas, and how to let the player know when they’ve beaten their own records.

HTML5 Avoider Game Tutorial: Multiple Moving Enemies
basix

HTML5 Avoider Game Tutorial: Multiple Moving Enemies

This entry is part 2 of 3 in the series HTML5 Avoider Game Tutorial

In the first part of this series, you learned the basics of using JavaScript and the canvas element to make a very simple HTML5 avoider game. But it’s too simple – the single enemy doesn’t even move – there’s no challenge! In this tutorial, you’ll learn how to create a never-ending stream of enemies, all falling from the top of the screen.

Learn HTML5 With This Simple Avoider Game Tutorial
basix

Learn HTML5 With This Simple Avoider Game Tutorial

This entry is part 1 of 3 in the series HTML5 Avoider Game Tutorial

In this tutorial (the first of a series), you’ll learn the basics of HTML5 game development with JavaScript and the canvas element. You don’t need to have any programming experience, or even any HTML experience (apart from this one article). Let’s get started!

Get Up to Speed With HTML – Basix
basix

Get Up to Speed With HTML – Basix

We’ll soon be publishing our first HTML5 tutorials here at Activetuts+, but before we start, here’s a fast and easy tutorial to get up to speed on the basics of HTML – even if you’ve never done any before.