Double Mouseover

[Total: 0    Average: 0/5]

Two images change as you mouse over another image.

Head Code:

<script>
function doIt(_n,_v)
{
  if(typeof _n == "undefined" ||
     typeof _v == "undefined")
  {
    alert("You did not define both parameters.");
	return;
  }
  if (_v)
  {
    //mouse over
	if(_n==2)
	{
      document.all.pic1.src=_imgs[1].src;
      document.all.pic2.src=_imgs[3].src;
	}
	else if(_n==4)
	{
      document.all.pic1.src=_imgs[2].src;
      document.all.pic4.src=_imgs[5].src;
	}
	else
	{
	  alert("MOUSEIN:n_n was not handled:nt"+_n);
	  return;
	}
  }
  else
  {
    // mouse out
	if(_n==2)
	{
      document.all.pic1.src=_imgs[0].src;
      document.all.pic2.src=_imgs[2].src;
	}
	else if(_n==4)
	{
      document.all.pic1.src=_imgs[0].src;
      document.all.pic4.src=_imgs[4].src;
	}
	else
	{
	  alert("MOUSEOUT:n_n was not handled:nt"+_n);
	  return;
	}
  }
}
</script>

Body Code:

<script>
var _imgs = new Array();
 _imgs[0] = new Image(); _imgs[0].src="http://www.js-examples.com/js/pic1.gif";
 _imgs[1] = new Image(); _imgs[1].src="http://www.js-examples.com/js/pic2.gif";
 _imgs[2] = new Image(); _imgs[2].src="http://www.js-examples.com/js/pic3.gif";
 _imgs[3] = new Image(); _imgs[3].src="http://www.js-examples.com/js/pic4.gif";
 _imgs[4] = new Image(); _imgs[4].src="http://www.js-examples.com/js/pic1.gif";
 _imgs[5] = new Image(); _imgs[5].src="http://www.js-examples.com/js/pic2.gif";
</script>
 
<table border=1>
<tr>
  <td rowspan=2><img src="http://www.js-examples.com/js/pic1.gif"
                     name=pic1
					 height=50
					 width=50></td>
  <td          ><a href="#"
                   onmouseover="doIt(2,true);"
				   onmouseout="doIt(2,false);"><img src="http://www.js-examples.com/js/pic3.gif"
				                                    name=pic2
													height=50
													width=50
													border=0></a></td>
</tr>
<tr>
  <td          ><a href="#"
                   onmouseover="doIt(4,true);"
				   onmouseout="doIt(4,false);"><img src="http://www.js-examples.com/js/pic1.gif"
				                                    name=pic4
													height=50
													width=50
													border=0></a></td>
</tr>
</table>


</body>

Times Viewed: 1

Leave a Reply

Your email address will not be published. Required fields are marked *