Click Image To Close Window - Tested in IE7.0, Netscape8.1.2, Opera9.10, Firefox2.0.0.1 and AOL Explorer1.5

T his is a little unknown trick to close a window that is unlike the normal "Close Window button" or "Close Window Text" link. It is the same little snipplet of javascript as the Close Window text link but without the text and is attached to an image. This is a unique way if you have a whole bunch of thumbnail pictures that when clicked, open to a full size in a new window to close the full size picture. If you grab the below link, it will open in a new window with an image on it. Just click the image to see what happens.
[ Click Me ]

We have tested the code in IE7.0, Firefox2.0.0.1, Opera9.10, Netscape8.1.2 and AOL Explorer1.5. This script worked well in all platforms with no variations observed.

T he below code is how to include a "Close Window" option within a graphic.

<a href="javascript: window.close()"><img src="Path To Uploaded Image" width="?" height="?" border="0" title="Click image to close this window"></a>

A ll we actually did was to put the text "Close Window" link together with a graphic and replaced the attribute of alt=" " with that of title=" ". We did remove the text itself and close the link* without any text </a>. Lets now define all the attributes that are associated with the graphic.

* When you close the link with the </a>, it is after the image. The close window javascript "Must" be positioned in front of the image or it will not work.

width="?" This is the width of the uploaded graphic that you are calling.
height="?" This is the height of the uploaded image that you are calling.
border="0" The zero (0) denote no border around the image link. A number of one (1) or greater will make a border. The higher the number, the wider the border.
title="?" When you place your cursor over the image, the text you insert here will be seen.

L et us go one step further and break it down one more step.

Close Window Text Javascript:
<a href="javascript: window.close()">Close Window*</a>

Image code:
<img src="Path To Uploaded Image" width="?" height="?" border="0" title="Click image to close this window">

* The words for this effect must be removed and you treat it just like a regular image link. So now lets put it all together again and see what we have.

<a href="javascript: window.close()"><img src="Path To Uploaded Image" width="?" height="?" border="0" title="Click image to close this window"></a>

Note of Importance ~ in reference to the positioning of the image code and the close window javascript. Do not place the close window javascript "After" the image code or it will "Not work. The close window javascript must be "Before" the image code. You close the link (</a>) after the image code.

I f you have any problems with this page or with anything else, feel free to consult our [ FAQ ] and if you can't find the answer there, [ contact us ].
[ Rate This Page ]

Search Our Site By Individual letter

[ A ] [ B ] [ C ] [ D ] [ E ] [ F ] [ G ] [ H ] [ I ] [ J-K ] [ L ]
[ M ] [ N-O ] [ P-Q ] [ R ] [ S ] [ T ] [ U-V ] [ W ] [ X-Y-Z ]

Little Tips Directory

[ Page 1 ] [ Page 2 ] [ Page 3 ] [ Page 4 ] [ Page 5 ] [ Page 6 ] [ Page 7 ]

[ Index Page 1 ] [ Index Page 2 ] [ Index Page 3 ] [ Index Page 4 ] [ Index Page 5 ]
[ Index Page 6 ] [ Index Page 7 ] [ Index Page 8 ] [ Index Page 9 ] [ Index Page 10 ]
[ Index Page 11 ] [ Index Page 12 ] [ Index Page 13 ] [ Form Index ]
[ 2001 ] [ 2002 ] [ 2003 ] [ 2004 ] [ 2005 ] [ 2006 ] [ 2007 ]

[ News Letter Archives ] [ Navigation Page ] [ Archives Of Published Material ]
[ Link To Us ] [ Alphabet Index ] [ Feedback ] [ On Line Support ] [ FAQ ]
[ Webmaster Utilities ] [ Casino ] [ Banner Exchange ] [ Advanced Site Search ]

If you are part of the ever growing number of webmasters who enjoy sharing your knowledge with others on web design, join The Consigliere Ltd. web ring to broaden your scope of exposure.
Join Today

This Site Was Built And Is Maintained Exclusively by
The Webmaster @ Consigliere Ltd.