我正在尝试在Google网站中嵌入一个简单的代码:source from here。
代码:
<!doctype HTML>
<html>
<head>
<title>Feedtank| html 5 canvas test</title>
<meta http-equiv="Content-Type" content="text/html; charset=iso-8859-1" />
<meta http-equiv="Content-Language" content="EN" />
<meta name="Author" content="Feedtank LLC" />
<meta name="Publisher" content="Feedtank LLC" />
<script type="text/javascript" src="http://ajax.googleapis.com/ajax/libs/jquery/1.3.2/jquery.js"></script>
<script type="text/javascript" src="anim.js" ></script>
<style type="text/css">
canvas {
border: 1px solid gray;
box-shadow: 3px 3px 7px #777;
}
body
{
background-color: #DDDDDD;
font-family: Helvetica, Verdana, Arial, serif;
color:#ACACA
}
h6{
color:#AA8888;
font-size:10px;
font-family: georgia;
text-decoration: underline;
}
h2{
font-size:10px;
margin: 0px;
padding-bottom:20px;
padding-left: 3px;
}
h4{
color:white;
font-size:60px;
text-shadow: 1px 1px 1px #888888, 1px 1px 1px #EEE;
margin: 0px;
}
div#title_holder{
width:640px;
text-align: left;
margin: 0px;
padding: 0px;
}
div#settings_holder{
width:600px;
border: 1px dotted #AA8888;
border-radius:2px;
margin: 0px;
padding:20px;
overflow: auto;
}
input#message{
font-size:22px;
color: #555555;
size: 30;
font-family: Helvetica, Verdana, Arial, serif;
border: 3px solid #AA8888;;
}
button{
font-size:12px;
padding:4px;
font-family: Georgia, Verdana, Arial, serif;
}
li{
list-style-type:none;padding:10px 0px 0px 3px;
color: #AA8888;
font-size:14px;
}
ul{
text-align: left;
}
h6#urlText{
margin: 4px;
}
p#Options{
color:#AA8888;
font-size:16px;
text-decoration: none;
margin: 2px;
font-family: georgia;
}
div#footer{
font-family: georgia;
font-size:12px;
font-weight: bold;
color:#888888;
}
a{
color:#AA8888
}
p#shareURL{
font-family: georgia;
font-size:12px;
font-weight: bold;
color:#888888;
}
</style>
</head>
<body>
<div id="wrapper" style="width:640px; margin-left: auto ;margin-right: auto ;">
<br>
<br>
<div id="title_holder">
<h4>HTML5</h4>
<h2>CANVAS MINIMAL PARTICLE ANIMATION DEMO </h2>
</div>
<canvas id="born_canvas" width="640" height="480">Missing the canvas </canvas>
<div id="hidden_canvas" >
<canvas id="born_canvas_hidden" width="100" height="100" style="display:none"></canvas>
</div>
<br>
<p id="Options">OPTIONS</p>
<div id="settings_holder">
<div style="float:left; width:600px margin:5px;padding-top:3px;padding-bottom:0px;" >
<input type="text" id="message" value="Hello" maxchars="50">
<button value="Change message" title="change Message" onmousedown="javascript:changeMessage();" >Change Message</button><br>
<br>
<p id="shareURL" style="display:inline">share url:</p>
<h6 id="urlText">http://www.feedtank.com/labs/html_canvas/?msg=Hello</h6>
<ul style="padding: 5px;">
<li><input type="radio" name="radio1" id="radio_Low" onmousedown="javascript:setMinNumCircles()" checked="true"> 300 SPRITES</li>
<li ><input type="radio" name="radio1" id="radio_High" onmousedown="javascript:setHighNumCircles()"> 1500 SPRITES (slow framerate)</li>
<li ><input type="checkbox" name="gravity" id="bGravity" onmousedown="javascript:setGravity()" > GRAVITY</li>
<li ><input type="checkbox" name="gravity" id="bGravity" onmousedown="javascript:setFade()" checked="true" > FADE</li>
</ul>
</div>
</div>
<br>
<br>
<div id="footer">
Feb 4th, 2010 | Created By <a href="http://www.feedtank.com">Feedtank</a>
</div>
</body>
</html>
但是当我尝试在W3SCHOOL here中运行代码时,会导致错误:
那我做错了什么?
答案 0 :(得分:1)
它显示错误,因为您的anim.js路径为false
<script type="text/javascript" src="anim.js" ></script>
和图像也不可用,所以请将所有支持文件正确放入项目文件夹然后运行,不要在w3schools中试用