OnMouseOver Examples
(Place Your Mouse Over The Images)
OnMouseOver Image Swap .
Code: :
<a href="#" onMouseOver="if (document.images) document.x.src='OnMouseOver-Image-URL';" onMouseOut="if (document.images) document.x.src='Image-URL';"><img src="Image-URL" width="?" height="?" name="x" alt=""></a>
<script type="text/javascript">
if (document.images) {var x=new Image(); x.src="OnMouseOver-Image-URL";}
</script>
OnMouseOver Image Swap As A Link .
(Use Your Browser's Back Button To Return)
Code: :
<a href="URL-Of-Link" onMouseOver="if (document.images) document.x.src='OnMouseOver-Image-URL';" onMouseOut="if (document.images) document.x.src='Image-URL';"><img src="Image-URL" width="?" height="?" name="x" alt=""></a>
<script type="text/javascript">
if (document.images) {var x=new Image(); x.src="OnMouseOver-Image-URL";}
</script>
Notes: :
1. Notice That The Only Coding Difference Is That The
Link Uses "A URL" And The Simple Swap Uses Just " # ".
2. You Need 2 Separate Images That Are The Same Size.
3. If Using Multiple Onmouseover Codes On The Same Page,
Replace The " x " In The Codes (5 Places)
With Something Else, So Each Code Is Different.
4. To Speed Loading (For Each Mouseover Image),
Put The Code(s) Below
Just Before Your </BODY> Tag.
<img width="1" height="1" border="0" src="OnMouseOver-Image-URL" alt="">
© s p a c e m a n - 2010
