Inside Technique : Introduction : The Image Showing

If the element that was right-clicked on was not an image, this part of the code executes:

else
  for ( var count = 0; count < ExtDoc.images.length; count++ )
    if ( ExtDoc.images[count].style.visibility == 'hidden' ) {
      if ( !ExtDoc.images[count].filters.blendTrans )
        ExtDoc.images[count].style.filter += ' blendTrans(duration=1)';
      ExtDoc.images[count].filters.blendTrans.apply();
      ExtDoc.images[count].style.visibility = 'visible';
      ExtDoc.images[count].filters.blendTrans.play();
    }

A "for" loop scans through every image on the target document, searching for any hidden ones. For each that it finds, it reverses the image-hiding done earlier by almost exactly repeating it. In other words, the blend transition is added, if needed; the object's current state is stored ("freezing" it); the object is revealed; and the transition is triggered.

That finishes this context menu. It was called "Hide Image" or "Show Hidden Images", depending on whether it appeared in the image or default/link menus. The script itself would either fade out an image or fade in all images, depending on the context. Besides demonstrating the "event" object, this script also used filters.

That ends this tutorial. From here, try out our samples by visiting the samples page.

© 1997-2000 InsideDHTML.com, LLC. All rights reserved.