I need to change the dimensions of an image when mouse is over <script Language="JavaScript"> function ChangeImage (ImageName) { this.width=30px; } </script> </head> <div class="container"> <ul> <li><a href="#"><img src="images/home.png" alt="home" onmouseover="ChangeImage(images/home.png)"/></a></li> <li><a href="#"><img src="images/email.png" alt="contact" /></a> </li> <li><a href="#"><img src="images/portfolio.png" alt="portfolio" /></a> </li> <li><a href="#"><img src="images/music.png" alt="music" /></a> </li> <li><a href="#"><img src="images/video.png" alt="video" /></a> </li> <li><a href="#"><img src="images/history.png" alt="history" /></a> </ul> </div> <body> Code (markup):
I don't think you're using "this" quite correctly. Try deleting the script block altogether, and make your images like this: <img src="images/home.png" alt="home" onmouseover="this.width='60';" /> Code (markup):
thanks for your solution,that was only for a test basicaly I am trying to built a function that when exist a mouseover event over a image, the image dimension will remain the same and to change the other images, to make them smaller, so I can float a div with text (description) near (to the right) the image where the mouse is over.