Replace Form Image

[Total: 0    Average: 0/5]

This example shows how to have an image replaced with another image.

Body Code:

<img src="http://www.js-examples.com/js/pic1.gif">
<BR>
<form name=exf1>
<input name=pic1 type=image src="http://www.js-examples.com/images/blue_ball0.gif">
<BR>
<input name=but1 type=button value="change image method 1" onclick=doIt()>
<BR>
<input name=but2 type=button value="change image method 2" onclick=doIt2()>
</form>
<script>
var img = new Array();
    img[0]=new Image();img[0].src="/images/blue_ball0.gif";
    img[1]=new Image();img[1].src="/images/blue_ball1.gif";
var count=0;
function toggle()
{
  count = (count + 1) % 2;
  return (count);
}
function doIt()
{
  var _s = null;
  document.images[0].src=img[toggle()].src;
  if (document.images[1])
    document.images[1].src=img[toggle()].src;
  else
    _s = "images[1] is not defined.";
  if (!document.exf1.pic1)
    _s += "
document.exf1.pic1 not defined.";
  if (_s) alert(_s);
}

function doIt2()
{
var s = "<html><head></head><body><form><input type=image src=/images/red_ball0.gif></form></body></html>";
document.open();
document.write(s);
document.close();
}
</script>

Times Viewed: 2

Leave a Reply

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