|
Menus and Navigation >>>
When the user clicks the thumbnail image the full picture loads in a new window. The window can optionally be configured to close a fixed number seconds after the page has loaded.
Step 1: Add the below code to the <body> section of your page:
<script
language="javascript"
type="text/javascript">
timeout
=0;
function
Start(URL,
WIDTH,
HEIGHT)
{
windowprops
=
"left=50,top=50,width="
+
(WIDTH+50)
+
",height="
+
(HEIGHT+50);
text
=
"<html><head><title>Preview</title></head><body bgcolor='white'";
if
(timeout
!=
0)
text
+="
onLoad=\"setTimeout('window.close()', "
+
timeout*1000
+
");\"";
text
+=
"><center><img src='"
+
URL
+
"'>";
if
(timeout
!=
0)
text
+="<br><font
face='arial, helvetica' size='-1'>Preview closes after "
+
timeout +
" seconds.</font>";
text
+=
"</center></body></html>";
preview
=
window.open("",
"preview",
windowprops);
preview.document.open();
preview.document.write(text);
preview.document.close();
}
</script>
<a
href="javascript:Start('toad.jpg')";><img
src="toad.jpg"></a>
|
Step 2: The script uses an image as part of its interface. You can create your own, or use the below (resized for easier download):
(right click image, and select "Save Image As")
Upload it into the same directory as your webpage.
|