JavaScript and valid HTML code

Forum Moderators: open

Message Too Old, No Replies

JavaScript and valid HTML code

I know next to nothing about JavaScript

steveoh

2:12 pm on Jul 16, 2013 (gmt 0)

I have downloaded a JavaScript script from a site. The effect it produces(ghosts flying around the page) works fine, but when I validate my code via W3(I have a XHTML 1.0 Transitional doc-type) it produces an error :

Line 30, Column 14: there is no attribute "onLoad".

The offending code is "<body onLoad="JSFX_StartEffects()">. How can I code this so the effect works and the code is valid?(I know next to nothing about JavaScript).

Fotiman

2:25 pm on Jul 16, 2013 (gmt 0)

Welcome to WebmasterWorld!
Remove the onLoad attribute. Then add another script at the bottom of your page, just before the closing </body> tag like so:


<body>
  ...
  <script src="ghosts_script.js" type="text/javascript"></script>
  <script type="text/javascript">
    JSFX_StartEffects();
  </script>
</body>

Note, whatever the script is that you're using has to be included before you call JSFX_StartEffects(), and ideally that should be included just before the closing </body> tag as well (NOT in the <head></head>... scripts are best placed as the last thing in the body for performance reasons).
Hope that helps.

steveoh

3:05 pm on Jul 19, 2013 (gmt 0)

Hi Fotiman ,thanks very much for replying to my post.
I've done what you suggested, but the ghosts have, well, given up the ghost and disappeared.

I've moved code from the <head> section and the code at the end of my script now reads -
....
<script type = "text/javascript" src = "../js/JSFX_Halloween.js">
</script>

<script type = "text/javascript">
function JSFX_StartEffects()
{
JSFX.AddGhost("../images2/ghost0.gif");
JSFX.AddGhost("../images2/ghost1.gif");
JSFX.AddGhost("../images2/ghost2.gif");
}
</script>

<script type = "text/javascript" JSFX_StartEffects()>
</script>
</body>
</html>

I've tried removing "<script type = "text/javascript" JSFX_StartEffects()></script>"
and tried putting "<script type = "text/javascript">
function JSFX_StartEffects(){...} </script> at the bottom but with no success.

Fotiman

3:13 pm on Jul 19, 2013 (gmt 0)

This is broken:

<script type = "text/javascript" JSFX_StartEffects()>
</script>

I think you mean for that to be this:

<script type = "text/javascript">
JSFX_StartEffects();
</script>

Fotiman

3:17 pm on Jul 19, 2013 (gmt 0)

End result should actually be something like this:


<body>
 ...
 <script type="text/javascript" src="../js/JSFX_Halloween.js"></script>
 <script type="text/javascript"> 
 function JSFX_StartEffects() 
 { 
  JSFX.AddGhost("../images2/ghost0.gif"); 
  JSFX.AddGhost("../images2/ghost1.gif"); 
  JSFX.AddGhost("../images2/ghost2.gif"); 
 } 

 JSFX_StartEffects();
 </script>
</body>

lucy24

8:44 pm on Jul 19, 2013 (gmt 0)

src="../

If you're absolutely positive that neither the page nor the script will ever move ;) Or you've got a package, where if one part moves, everything else will move correspondingly.

steveoh

1:47 pm on Jul 23, 2013 (gmt 0)

Thanks very much for this, Fotiman.
I've changed the code and it's working fine.