Basic Setup for HTML Canvas

This is a basic setup for starting any project in HTML5 CANVAS and Javascript.
The script that is being used is Modernizer.js which is is a JavaScript library that detects HTML5 and CSS3 features in the user’s browser.


    Canvas Study




            Your browser does not support HTML5 Canvas.



    window.addEventListener(‘load’, eventWindowLoaded, false);

    function eventWindowLoaded() {



    function canvasSupport() {

        return Modernizr.canvas;


    function canvasApp() {

        if (!canvasSupport()) {


        } else {

            var theCanvas = document.getElementById(“canvas”);

            var context = theCanvas.getContext(“2d”);



        function drawScreen() {

            context.font = ’20px _sans’;

            context.textBaseline = ‘top’;

            context.fillText(“Canvas!”, 0, 0);



This code should produce a page that outputs the text “Canvas!” in a canvas with white background.