Toile non visible

J'ai suivi des tutoriels concernant la création d'une toile, mais cela ne fonctionne pas et le rectangle n'est pas dessiné dessus. Est-ce une nécessité d'avoir le script dans le <head>? Toute aide serait appréciée!Toile non visible

Voici un JSFiddle avec mon code.

<!DOCTYPE html> 
<html> 
    <head> 
     <title>Simple animations in HTML5</title> 
    </head> 
<body> 
<h2> Optical Illusion </h2> 
<video id="illusion" width="640" height="480" controls> 
    <source src="Illusion_movie.ogg"> 
</video> 

<div id="buttonbar"> 
    <button onclick="changeSize()">Big/Small</button> 
</div> 

<p> 
Watch the animation for 1 minute, staring at the centre of the image. Then look at something else near you. 
For a few seconds everything will appear to distort. 
Source: <a href="http://en.wikipedia.org/wiki/File:Illusion_movie.ogg">Wikipedia:Illusion  movie</a> 
</p> 

<script> 
    var myVideo=document.getElementById("illusion"); 
    var littleSize = false; 
    function changeSize() 
    { 
     myVideo.width = littleSize ? 800 : 400; 
     littleSize = !littleSize;//toggle boolean 
    } 
</script> 

<canvas id= "myCanvas " width= "500 " height= "500 "> 
    style="border:1px solid #000000;"> 
</canvas> 

<script> 
    var canvas = document.getElementById("myCanvas"); 
    var context = canvas.getContext("2d"); 
    context.fillStyle = "blue"; 
    context.fillRect(20, 50, 200, 100); 
</script> 
</body> 
</html>

Source

2013-05-03 user1554786

J'ai nettoyé votre code que vous aviez quelques espaces qui causaient des problèmes.

~~également lorsque vous utilisez la balise de script définir l'attribut de type:~~

~~<script type="text/javascript"> // your code here </script>~~

Voici un Fiddle corrigé: http://jsfiddle.net/8bK4y/

Edit: Comme indiqué attribut ci-dessous type n'est pas nécessaire pour le Doctype HTML5.

Source

2013-05-03 00:26:31

L'attribut "type" d'un script n'est pas requis en HTML5 (que l'OP utilise), et par défaut "text/javascript" – Ian

Merci, se demandait pourquoi le rectangle ne s'affichait pas! – user1554786

@Ian je ne savais pas cela, acclamations. –

je pense que vous devez supprimer « > » de cela aussi supprimer les espaces supplémentaires

<canvas id= "myCanvas " width= "500 " height= "500 "> 
    style="border:1px solid #000000;"> 
</canvas>

devenir comme si

<canvas id="myCanvas" width="500" height="500" style="border: 1px solid #000000;"> 
</canvas>

Source

2013-05-03 00:21:55 Waqleh

problème résolu, merci! – user1554786

Toile non visible

Répondre

Questions connexes