HTML/Appendices/Overzicht elementen/canvas

Uit Wikibooks
Naar navigatie springen Naar zoeken springen

HTML

Inhoudsopgave
  1. Verklarende woordenlijst
  2. Overzicht tags
  3. Overzicht attributen
  4. Andere cursussen

Functie[bewerken]

Met dit element kun je onder andere tekeningen maken.

Voorbeeld[bewerken]

HTML-code: Een voorbeeld van het gebruik van het element canvas

<canvas id="canvas" width="400" height="400">Gebruik een browser die het html5 element canvas ondersteunt</canvas>

Zoals je ziet is er alleen het element. De tekst die je erin zet is voor het geval de gebruiker een browser gebruikt die het canvaselement niet ondersteunt. Het verdere verloop van het canvaselement is te vinden in een stukje javascriptcode.

JavaScript-code: Het javascriptgedeelte van het canvas element

<script language=javascript type=text/javascript>
// Hier wordt het canvas klaar gemaakt
var c = document.getElementById("canvas");
var ctx = c.getContext("2d");

// We gaan nu een lijn tekenen
ctx.beginPath(); 
ctx.lineWidth="2"; // Hier wordt de lijndikte bepaald
ctx.strokeStyle="green"; // We kiezen voor een groene lijn
ctx.moveTo(0,0);
ctx.lineTo(400,400);
ctx.stroke(); // Hier tekenen we de lijn
</script>


HTML elementen

a | abbr | acronym | address | applet | area | b | base | basefont | bdo | big | blockquote | body | br | button | caption | center | cite | code | col | colgroup | dd | del | dfn | dir | div | dl | dt | em | fieldset | font | form | frame | frameset | head | hr | html | hx | i | iframe | img | input | ins | kbd | label | legend | li | link | map | menu | meta | noframes | noscript | object | ol | optgroup | option | p | param | pre | q | s en strike | samp | script | select | small | span | s en strike | strong | style | sub | sup | table | tbody | td | textarea | tfoot | th | thead | title | tr | tt | u | ul | var

Nieuwe elementen die zullen worden geïntroduceerd met HTML 5

article | aside | audio | canvas | command | datalist | details | dialog | embed | figure | footer | header | hgroup | keygen | mark | meter | nav | output | progress | rp | rt | ruby | section | source | time | video

Informatie afkomstig van http://nl.wikibooks.org Wikibooks NL.
Wikibooks NL is onderdeel van de wikimediafoundation.