Recent Posts

Small and simple Javascript Codes to change/alter image from older to new one then again change to earlier image when roll out from image.
In the image roll-over/alter_image script of the previous session, the code for changing the image was placed inside the event handlers. This is fine if there are one or two images. In case of several images, it is advisable to pack the code in a function that can be called repeatedly by event handlers using different parameters.

This section should be placed in head.
<head>
<script type="text/javascript">
function alter_image(image_src,image_name)
{
document[image_name].src = image_src;
}
</script>
</head>

This section should be placed in body.
<body>
<a href="javascript:void(0);" onmouseover="alter_image('image/photo2.jpeg','image1')" onmouseout="alter_image('image/photo1.jpeg','image1')">
<img src="image/photo1.jpeg" name="image1" border="0">
</a>
</body>

1 General Category / General Discussion / Re: Change Image on mouse event on: September 18, 2009, 06:11:46 PM
Started by computereducationworld - Last post by computereducationworld
I don't want to make second post with the same title although difference in methods.So you can also use.. function alter_image(image_src,image_name) { document.getElementById(image_name).src=image_src; } <a href="javascript:void(0);" onmouseover="alter_image('image/photo2.jpeg','image1')" onmouseout="alter_image('image/photo1.jpeg','image1')" rel="nofollow"> <img src="image/photo1.jpeg" id="image1" border="0"> </a> Try this it also work the same. only with slight changes as id and use of getElementById.

2 General Category / General Discussion / Change Image on mouse event on: September 16, 2009, 01:29:21 PM
Started by computereducationworld - Last post by computereducationworld
Small and simple Javascript Codes to change/alter image from older to new one then again change to earlier image when roll out from image. In the image roll-over/alter_image script of the previous session, the code for changing the image was placed inside the event handlers. This is fine if there are one or two images. In case of several images, it is advisable to pack the code in a function that can be called repeatedly by event handlers using different parameters. This section should be placed in head. <head> <script type="text/javascript"> function alter_image(image_src,image_name) { document[image_name].src = image_src; } </script> </head> This section should be placed in body. <body> <a href="javascript:void(0);" onmouseover="alter_image('image/photo2.jpeg','image1')" onmouseout="alter_image('image/photo1.jpeg','image1')"> <img src="image/photo1.jpeg" name="image1" border="0"> </a> </body>