If the mouse is over on another picture it show's it but wont change it back when the mouse is over an another one.

Wonder how would it go and change the mouseover for loverpicture.

my code:

<html>
<head>
<script type="text/javascript">

function changepic()
{
document.getElementById("demo").style.top=400 ;
}
function changepic1()
{
document.getElementById("demo1").style.top=400;
document.getElementById("demo1").style.left=400;

}

</script>
</head>
<body>
<div start>
<h1>My First Web Page</h1>

<img id="demo" src="Megane.jpg" style="position:absolute; left: 400; top: 100; width: 80; height: 200;" onmouseover="changepic()"/>
<img src="Megane.jpg" style="position:absolute; left: 400; top: 100; width: 80; height: 200;" onmouseover="changepic()"/>

<img id="demo1" src="scenic.jpg" style="position:absolute; left: 200; top: 100; width: 80; height: 200;" onmouseover="changepic1()"/>

<img src="scenic.jpg" style="position:absolute; left: 200; top: 100; width: 80; height: 200;" onmouseover="changepic1()"/>



</body>
</html>