Growing Button Example Source


// Copyright © 2002 by Apple Computer, Inc., All Rights Reserved.
//
// You may incorporate this Apple sample code into your own code
// without restriction. This Apple sample code has been provided "AS IS"
// and the responsibility for its operation is yours. You may redistribute
// this code, but you are not permitted to redistribute it as
// "Apple sample code" after having made changes.

<HTML><HEAD><TITLE>Resizing Images</TITLE>
<script type="text/javascript">
<!--

function makeBig()
{
  var the_image;

  // if this is NN6 or IE4+
  if (document.documentElement || document.all) 
  {
    the_image = document.the_button;
    the_image.height = the_image.height + 2;
    the_image.width = the_image.width + 2;
  } 
  else if (document.layers)  // NN4
  {

    the_image = document.justforNS4.document.the_button;
    var new_width = the_image.width + 2;
    var new_height = the_image.height + 2;
   
    var write_string = getWriteString(new_width, new_height);
    document.justforNS4.document.writeln(write_string);
    document.justforNS4.document.close();
  }


  if (the_image.height < 110)
  {
    setTimeout("makeBig();", 10);
  }
}

function makeSmall()
{
  if (document.documentElement || document.all) 
  {
    the_image = document.the_button;
    the_image.height = the_image.height - 2;
    the_image.width = the_image.width - 2;
  } 
  else if (document.layers)
  {
    the_image = document.justforNS4.document.the_button;
    var new_width = the_image.width - 2;
    var new_height = the_image.height - 2;
  
    var write_string = getWriteString(new_width, new_height);
    document.justforNS4.document.writeln(write_string);
    document.justforNS4.document.close();
  }

  if (the_image.height > 100)
  {
    setTimeout("makeSmall();",10);
  }
}

function getWriteString(width, height)
{

    var image_string = "<img src='button.gif' border='0' " +
       "width = '" + width + "' height = '" + height + "'>";

    return image_string;
}

// -->
</script>
</HEAD>
<BODY>


<div id="justforNS4" style="position:absolute;top:50;left:5;">
<a href = "#" onClick="alert('thanks!');">
<img src="button.gif" name="the_button" border="0"></a>
</div>

<a href="#" onMouseOver="makeBig();" 
            onMouseOut="makeSmall();">Resize image</a>
</BODY>
</HTML>