Member
From: Sydney, Australia
Registered: 2004-10-23
Posts: 593
I've been thanked 0 times.
Offline
This looks like the oplace I need to ask this terribly importat question... 
I would like to know how I do that thing (pretty technical) where there is a small image and you can click it and a little window comes up with a larger version of the image. I call it the "Click To Enlarge" thingie.
Thanks,
Wiz
I cried because I had no shoes - until I saw a man who had no feet...
Administrator
From: Colorado, USA
Registered: 2006-02-15
Posts: 2230
I've been thanked 95 times.
Offline
Try this out.
Place in the head section;
Code: javascript
<script type="text/javaScript">
<!-- Begin
function popUp(URL) {
day = new Date();
id = day.getTime();
eval("page" + id + " = window.open(URL, '" + id + "', 'width=450,height=450,left = 279,top = 285.5');");
}
// End -->
</script>
Use for the link;
Code: javascript
<a href="javascript:popUp('images/large.jpg')"><img src="images/small.jpg" alt="just a small image"></a>
You might also want to check out this site http://www.huddletogether.com/projects/lightbox/
Attention designers and webmasters - "The Beauty of CSS"
Valid Web Designs tutorials on HTML, XHTML and CSS
Home Security Systems
Member
From: Sydney, Australia
Registered: 2004-10-23
Posts: 593
I've been thanked 0 times.
Offline
Thanks Coloeagle,
Sorry it took a day or so to get back - been sick.
Looking at the code, it looks like each image needs to have the same file name?? This can't be, obviously. What do I name the images? Are there actually two images that are sized by me or does the script resize the one image and make it larger or smaller)?
Thanks
P.S. I put these codes in and nothing happened (I left the image file names as they were, as they obviously can't all have the same image name...
Thanks again,
Wiz 
I cried because I had no shoes - until I saw a man who had no feet...
Administrator
From: Colorado, USA
Registered: 2006-02-15
Posts: 2230
I've been thanked 95 times.
Offline
Hello Wiz,
The images will need to be sized by you.
I use two images. One a small thumbnail under 3k in size and then a larger one around 15-20k. You can see just what I have at http://www.gateviewconstruction.com/purcell.htm.
By setting the image size in the head section of the script to the same size as your large image it eliminates the extra white space around the image.
CE
Attention designers and webmasters - "The Beauty of CSS"
Valid Web Designs tutorials on HTML, XHTML and CSS
Home Security Systems
Administrator
From: you know you want a caricature
Registered: 2004-11-08
Posts: 3431
I've been thanked 33 times.
Offline
or you can just have it like a normal link and the big image opens in a new window...
Member
From: Sydney, Australia
Registered: 2004-10-23
Posts: 593
I've been thanked 0 times.
Offline
Thank boys,
I'll give it a go.
Wiz 
I cried because I had no shoes - until I saw a man who had no feet...
Member
From: Sydney, Australia
Registered: 2004-10-23
Posts: 593
I've been thanked 0 times.
Offline
I thought of the link to a larger image in a differnet page, but it seemed 'cumbersome, when I figured there was some java script for the same thing.
Thanks
Wiz 
I cried because I had no shoes - until I saw a man who had no feet...
Administrator
From: Colorado, USA
Registered: 2006-02-15
Posts: 2230
I've been thanked 95 times.
Offline
It really is not that cumbersome. I have done this for visitors that have JS disabled or do not use flash.
On the page I posted earlier if a visitor clicks on View images loaded one at a time. They can then click on the next or previous to view the images.
This does have an advantage as you can then place more information about the current image.
Attention designers and webmasters - "The Beauty of CSS"
Valid Web Designs tutorials on HTML, XHTML and CSS
Home Security Systems
Administrator
From: you know you want a caricature
Registered: 2004-11-08
Posts: 3431
I've been thanked 33 times.
Offline
the new page does not have to be full size either - you can specify the size 
Member
From: Sydney, Australia
Registered: 2004-10-23
Posts: 593
I've been thanked 0 times.
Offline
How does one do that, Matte??
Thanks
Wiz 
I cried because I had no shoes - until I saw a man who had no feet...
Administrator
From: you know you want a caricature
Registered: 2004-11-08
Posts: 3431
I've been thanked 33 times.
Offline
Code: html
<a href="#" onClick="MyWindow=window.open('http://www.yoursite.com/page.html','MyWindow','toolbar=no,location=no,directories=no,status=no,menubar=no,scrollbars=no,resizable=yes,width=500,height=300'); return false;">PLACE_YOUR_LINKTEXT_HERE</a>Member
From: Sydney, Australia
Registered: 2004-10-23
Posts: 593
I've been thanked 0 times.
Offline
Thanks Matte - appreciate it.
Steve 
I cried because I had no shoes - until I saw a man who had no feet...
Administrator
From: Colorado, USA
Registered: 2006-02-15
Posts: 2230
I've been thanked 95 times.
Offline
Hey Matte,
I have been playing around with your script, I like it . 
Attention designers and webmasters - "The Beauty of CSS"
Valid Web Designs tutorials on HTML, XHTML and CSS
Home Security Systems
| Never |


