Evil Science A whole load of stuff

9Apr/150

Notepad++ Emmet jQuery Template

Here's a little addition I've made for the excellent Notepad++ plugin Emmet. It's a shortcut that creates a HTML5 template with a link to jQuery "jquery-2.1.3.min.js" and a "$(document).ready" function, as shown below.

emmet

It's straightforwards to do, and requires three additions to Emmet's "snippets.json" file, that is located in the Notepad++ direction "\plugins\EmmetNPP\emmet\".

Addition 1, to the section "snippets", a child of "html":

"jqdocready": "\\$(document).ready(function() {\n\n});"

Additions 2 and 3, to the section "abbreviations", a child of "html":

"docjq2":"html>(head>meta[charset=UTF-8]+title{${1:Document}}+script[src=http://code.jquery.com/jquery-2.1.3.min.js]+script[type=text/javascript]>jqdocready)+body",

"html:5jq2":"!!!+docjq2[lang=${lang}]",

In situ, the three additions look like this:

emmet1

emmet2

 

Obviously, make changes at your own risk, but if done correctly, this will work. Cheers m'dears,

Filed under: HTML5, Main No Comments
11Feb/140

HTML 5: Canvas Element

ML 5 defines the <canvas> element as “a resolution-dependent bitmap canvas which can be used for rendering graphs, game graphics, or other visual images on the fly.” A canvas is a rectangle in your page where you can use JavaScript to draw anything you want.

This excellent article examines the canvas element in detail, clearly and concisely.

Filed under: HTML5 No Comments