onmouseover and onmouseout event in javascript

Question

i'm new to javasript and i have asimple code which worked fine in google chroome but the script din't fire with firefox it's just two event on onmouseover and onmouseout and change images

<!DOCTYPE html>
<html>
<head>
    <title> </title>
    <script>

        function over() {
        image1.src = "13.JPG"
              }


        function out() {
        image1.src = "19.JPG"
              }
    </script>

    <style>
        img {
        height:200px; width:200px;
        }
    </style>

</head>
<body>

    <img  id="image1" onmouseover="over()" onmouseout="out()" />

</body>
</html>

and it's worked fine in google chroome but not in firefox and i want to know why , thanks.

Answer 1

Here's how to do this with javascript:

 function over() { document.getElementById('image1').src = "http://animalrescuetracy.org/wp-content/uploads/2014/07/playful-kitten-6683.jpg"; } function out() { document.getElementById('image1').src = "http://www.valleyvet.com/images/worming-your-kitten.png"; }

 img { height:200px; width:200px; }

 <img id="image1" src="" onmouseover="over()" onmouseout="out()"/>

Here's how to do it with css:

 #image1{ content:url("http://www.valleyvet.com/images/worming-your-kitten.png"); height:200px; width:200px; } #image1:hover{ content:url("http://animalrescuetracy.org/wp-content/uploads/2014/07/playful-kitten-6683.jpg"); }

  <img id="image1" src=""/>

onmouseover and onmouseout event in javascript

Question

1 answers

solution1
0 ACCPTED 2015-01-10 07:13:22

onmouseover and onmouseout event in javascript

Question

1 answers

solution1 0 ACCPTED 2015-01-10 07:13:22

solution1
0 ACCPTED 2015-01-10 07:13:22