How to make a single image (not a product image) enlarge into its own popup window?

[J9MM0]

Hi,
We have created some new information pages with images and would like to know how a customer can click on the image and it pops up large in its own window (similar to how the product images work) so they can see it better.
Please see http://www.selfbuildplans.co.uk/inde...age=buildcosts
and the build cost image in grey, that I want customers to be able to click it to read better.
I have the image as a larger image but cant figure out the hyperlink code for it to popup large...
Please help...

Thanks.

[nigelt74]

Theres 2 ways you can either use code like the below, (obviously change width and height to suit)

<a href="#" onClick="MyWindow=window.open('LOCATION_OF_LARGE_IMAGE','MyWindow','toolbar=no,l ocation=no,directories=no,status=no, menubar=no,scrollbars=no,width=600,height=300'); return false;">SMALL_IMAGE</a>


Or you can use the inbuilt popup method

BUT, I think (and i am possibly wrong) the inbuilt one sets itself to the size of your large product image setting, which could make your plans appear in a fairly small window

[J9MM0]

Thanks Nigelt74 that was a quick reply.
However, I have tried your link but I must have the path incorrect to the actual large image as it just goes back to the home page when you click it.
Could you give us some help in the path required where you state 'LOCATION_OF_LARGE_IMAGE'?
The images are in /images but do I need http:// path or the whole website path? I have tried a few options but can't get it to work...
Thanks for your help.

[nigelt74]

Thanks Nigelt74 that was a quick reply.
However, I have tried your link but I must have the path incorrect to the actual large image as it just goes back to the home page when you click it.
Could you give us some help in the path required where you state 'LOCATION_OF_LARGE_IMAGE'?
The images are in /images but do I need http:// path or the whole website path? I have tried a few options but can't get it to work...
Thanks for your help.

You will need to show me the code you are using, as looking at the page you seem to have done something odd as i can see part of the code on the actual page

[nigelt74]

This is what you should have

<a href="#" onClick="MyWindow=window.open('/images/Build Costs September 2011.png','MyWindow','toolbar=no,location=no,directories=no,status=no, menubar=no,scrollbars=no,width=800,height=400'); return false;"><img src="/images/Build Costs September 2011 med.png"</a>

[J9MM0]

Nigelt74 - That's great it works a treat, really appreciate it.
Thanks.