Tricks: How to...
Image effects:
› Preload images
› Preload images 2
› Swap images
› Swap images 2
› View larger image
› Image transparency
› Image slideshow
Special effects:
› Border
› Border 2
› Watermark
› Scroller
› Scroller 2
› Link hover color
› Custom cursor
› Snowing
› Auto window resizer
› Link tips
› Popup
Buttons & menus:
› Back button
› Java buttons
› Flat buttons
› Slide menu
› Drop down menu
› Alphabet menu
Mouse effects:
› Elastic mouse
› Mouse snake
› Mouse stars
› Mouse orbit
› Mouse eyes
Text generators:
› Infobox
› Quote generator
› Fading messages
› Text fader
› Text glow
› Credits

home > real world > web resource > web source codes >

View COLOR_WHEEL.JPG.

STEP 1/2: Copy this code into the <HEAD> of your HTML document:

<HEAD>
<SCRIPT LANGUAGE="JavaScript">
<!-- Begin
timeout=10;
function ST(URL, WIDTH, HEIGHT, ALT) {
   windowprops = "left=50,top=50,width=" + (WIDTH+50) + ",height=" + (HEIGHT+120);
   text = "<html><head><LINK rel='stylesheet' href='elf.css' type='text/css'></head><body ";
   if (timeout != 0) text +=" onLoad=\"setTimeout('window.close()', " + timeout*1000 + ");\"";
   text += "><center><b>"+ALT+"</b>
<img src='" + URL + "' alt='" + ALT + "' border=1>";
   if (timeout != 0) text +="
<font size='-1'>This window will automatically close itself within " + timeout + " seconds.</font>
<form><input type='button' value='Close window now' onClick='window.close()'></form>";
   text += "</center></body></html>";
   preview = window.open("", "preview", windowprops);
   preview.document.open();
   preview.document.write(text);
   preview.document.close();
}
// End -->
</script>
</HEAD>

STEP 2/2: Put this code into the <A> tag:

<P>View <a href="javascript:ST('color_wheel.jpg', 256, 256, 'Color wheel')"; onMouseOver="window.status='View larger image'; return true"; onMouseOut="window.status=''; return true"; onMouseDown="window.status='View larger image'; return true";>COLOR_WHEEL.JPG</a>.</P>