I remember when I started working with HTML5 and I was surprised I couldn't find a decent tutorial for making a simple MCQ quiz. So now that I've gotten more confident with the technology, I've decided to publish my own. Putting together a short quiz is an excellent project for someone starting off with a technology, and it's great for someone crossing over into HTML5 from Flash.
The tutorial is here: http://www.flashbynight.com/tutes/html5quiz/
And it includes all the code and artwork you need for the project.
UPDATE: I have produced a simpler version, see here: http://www.flashbynight.com/tutes/mcqquiz
and a version with pictures here: http://www.flashbynight.com/tutes/pixquiz
The new versions will work on phone screens too.
UPDATE 2: A version with a varied number of options:
example: http://flashbynight.com/tutes/mcqquiz/example2/
source: http://flashbynight.com/tutes/mcqquiz/example2/source.zip
Thursday, May 31, 2012
Monday, May 14, 2012
HTML5 - Prevent that green highlight on an Android touch event
The Android operating system puts a green highlight around certain items when they are selected. Now, if you are creating, say, a quiz on the HTML5 canvas, you don't want that. What's more, I believe the iPad displays an orange highlight.
To get rid of all these nuisances, put this line of code in canvas element
-webkit-tap-highlight-color:rgba(0, 0, 0, 0);
To get rid of all these nuisances, put this line of code in canvas element
-webkit-tap-highlight-color:rgba(0, 0, 0, 0);
Subscribe to:
Posts (Atom)