2013-06-21 47 views
0

我正试图在Google网站中嵌入一段简单的代码:source from here将JavaScript代码嵌入到Google网站中会导致错误

代码:

<!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运行的代码,它导致错误:

enter image description here

我在做什么错呢?

+0

您的网站的工作原理,为什么你希望它显示在W3School页面呢?它不会以任何方式帮助你。 – AntouanK

回答

1

它显示错误,因为你的anim.js路径是假

<script type="text/javascript" src="anim.js" ></script> 

和图像也不会即时拍摄,所以请妥善把你所有的支持文件在项目文件夹,然后运行,不要试图在w3schools

相关问题