CODEWITHSUNDEEP
javascriptonmouseover
alex_wang
alex_wang

Reputation: 209

JavaScript question -- onMouseOver event

Why doesn't this piece of code swap images on mouse-over as intended?:

<a href="#" onMouseOver="
 if (document.the_image.src == '01.jpg')
 {
  document.the_image.src = '02.jpg';
 }
 else if (document.the_image.src == '02.jpg')
 {
  document.the_image.src = '03.jpg';
 }
 else
 {
  document.the_image.src = '01.jpg';
 }
 ">
Some image</a><br>

Upvotes: 0

Views: 648

Answers (3)

alex_wang
alex_wang

Reputation: 209

Finally, I've figured out how to post the complete code. Thanks very much!:

<HTML>
<head>

<title></title>
<script language="javascript">
    var name = prompt('What is your name?', '');
    document.writeln('Welcome, ' + name + '.');
</script>
</head>


<body>

<a href="#" onMouseOver="
    if (document.the_image.src == '01.jpg')
    {
        document.the_image.src = '02.jpg';
    }
    else if (document.the_image.src == '02.jpg')
    {
        document.the_image.src = '03.jpg';
    }
    else
    {
        document.the_image.src = '01.jpg';
    }
    ">
<img src="01.jpg" name="the_image"></a><br>


</body>

</HTML>

Upvotes: 0

Dustin Laine
Dustin Laine

Reputation: 38543

To complement @jaywon answer, if that is the case you can use this to ensure that it is matching regardless of absolute or relative URL.

if (document.the_image.src.indexOf('01.jpg') > 0) {
...
}

Upvotes: 1

jaywon
jaywon

Reputation: 8234

Most likely in the rendered HTML, the image source is an absolute URL, so the src is probably "http://mydomain.com/01.jpg"

To test this, try setting an alert() in your code to see what the actual src value is

You should probably also put that code in a function, that's a lot of javascript to put in inline HTML.

Upvotes: 1

Related Questions