|
||
| Inside Technique : Image Gallery This demonstrates how to create an image gallery where the user can click and expand the image to see its full size. The code for this example can be pasted into any HTML document. It automatically makes all the images zoom to twice their original size.
Code
function zoomImage() {
with (event.srcElement) {
// Test if the user clicked on an image
if ("IMG"==tagName) {
// Test if this image has been zoomed.
if (null==event.srcElement.zoomed)
event.srcElement.zoomed=false // Initialize
zoomed = !(zoomed)
// Scale the image.
if (zoomed) {
width*=2;
height*=2;
}
else {
width*=.5;
height*=.5;
}
}
}
}
document.onclick = zoomImage;
© 1997-2000 InsideDHTML.com, LLC. All rights reserved. |