Solved

How to get larger image on click

Posted on 2012-04-09
3
259 Views
Last Modified: 2012-04-11
Hello EE,

I need to create a web site. i have a list of images to insert in a page and when the user clicks an image, I need the image to Pop larger then with an "X" he can close the larger image and return back to the list


How can I do that ?
0
Comment
Question by:PhilippeRenaud
3 Comments
 
LVL 9

Expert Comment

by:wasiftoor
ID: 37823968
Please refer to the following link:

http://www.dynamicdrive.com/dynamicindex4/thumbnail.htm

You can get the Javascript code as well as the Stylesheet code from here.

Good Luck!
0
 
LVL 42

Expert Comment

by:sedgwick
ID: 37823989
add click event handler on each and every image on your page using:
Image1.Attributes["onclick"]="showModalDialog('imagePopup.aspx?url='+this.src,'', '
');

add imagePopup.aspx page, set its position and size and get the image source passing in the url in the Page_load().
0
 
LVL 12

Accepted Solution

by:
Anuradha Goli earned 500 total points
ID: 37826832
The logic behind this scenario is:
In the list you just display the thumbnail of image and , on its hover /click you show the original image.
When you insert image , store it in to folders one with thumbnails by scaling it to 10% of image size,depends on your image size.
And store all the original files in other folder,to popup big image.

For such implementation logic , you can use lot of Jquery image popups
There are a lot of jQuery plugins available for this

Thickbox ---  http://jquery.com/demo/thickbox/
LightBox --- http://leandrovieira.com/projects/jquery/lightbox/
FancyBox --- http://fancybox.net/
FaceBox --- http://famspam.com/facebox
NyroModal --- http://nyromodal.nyrodev.com/
PiroBox ---  http://www.pirolab.it/pirobox/
0

Featured Post

3 Use Cases for Connected Systems

Our Dev teams are like yours. They’re continually cranking out code for new features/bugs fixes, testing, deploying, testing some more, responding to production monitoring events and more. It’s complex. So, we thought you’d like to see what’s working for us.

Question has a verified solution.

If you are experiencing a similar issue, please ask a related question

Entity Framework is a powerful tool to help you interact with the DataBase but still doesn't help much when we have a Stored Procedure that returns more than one resultset. The solution takes some of out-of-the-box thinking; read on!
Performance in games development is paramount: every microsecond counts to be able to do everything in less than 33ms (aiming at 16ms). C# foreach statement is one of the worst performance killers, and here I explain why.
A short tutorial showing how to set up an email signature in Outlook on the Web (previously known as OWA). For free email signatures designs, visit https://www.mail-signatures.com/articles/signature-templates/?sts=6651 If you want to manage em…
Finds all prime numbers in a range requested and places them in a public primes() array. I've demostrated a template size of 30 (2 * 3 * 5) but larger templates can be built such 210  (2 * 3 * 5 * 7) or 2310  (2 * 3 * 5 * 7 * 11). The larger templa…

803 members asked questions and received personalized solutions in the past 7 days.

Join the community of 500,000 technology professionals and ask your questions.

Join & Ask a Question