jan86 jan86 - 16 days ago 5
HTML Question

Javascript function not recognized in HTML

I'm trying to call a java script function on my mouse over function for an image, however; the debugger says "function isn't defined." I don't understand why I'm getting this error. The java script and tags look to be correct and it seems like I'm using the correct syntax to call the function.



<!DOCTYPE HTML>
<html>
<head>
<meta charset="utf-8">
<title>Chapter11-1</title>
<script type="text/javascipt">

function overButton(img) {
buttonImg="chapter11-1"+img+"_over.gif"
document.getElementById(img).src=buttonImg
}

function downButton(img) {
buttonImg="chapter11-1"+img+"_down.gif"
document.getElementById(img).src=buttonImg
}

function upButton(img) {
buttonImg="chapter11-1"+img+"_up.gif"
document.getElementById(img).src=buttonImg
}
</script>
</head>
<body>
<div id="banner_logo"><img src="chapter11-1banner.jpg" width="745" height="150" alt="banner" id="banner" /></div>
<table class="centerItems">
<tr>
<td>
<a href="#">
<img src="chapter11-1home_up.gif" id="home" alt="home" onMouseOver="overButton('home')" onMouseDown="downButton('home')" onMouseOut="upButton('home')" onMouseUp="upButton('home')" /></a>
</td>
</body>
</html>




Answer

It doesn't work because you spelled "javascript" wrong.
Change this

<script type="text/javascipt">

to

<script type="text/javascript">

or just

<script>

Otherwise it's assumed that the script tag is something other than javascript

And use lowercase for the events, preferably you'd use addEventListener