jQuery: How can I show an image popup onclick of the thumbnail?

jquery jquery-plugins popup
dexter picture dexter · Jan 14, 2010 · Viewed 249.6k times · Source

In my aspx page I have a thumbnail image <img>. When the user clicks on that image I would like a popup to show that blocks out the rest of the UI with the larger (full) version of the image.

Are there any plugins that can do this?

Answer

rahul picture rahul · Jan 14, 2010

There are a lot of jQuery plugins available for this

Thickbox

LightBox

FancyBox

FaceBox

NyroModal

PiroBox

Thickbox Examples

For a single image

  1. Create a link element ()
  2. Give the link a class attribute with a value of thickbox (class="thickbox")
  3. Provide a path in the href attribute to an image file (.jpg .jpeg .png .gif .bmp)

Related questions

What's the easiest way to call a function every 5 seconds in jQuery?

JQuery, how to call a function every 5 seconds. I'm looking for a way to automate the changing of images in a slideshow. I'd rather not install any other 3rd party plugins if possible.

Read More
How to disable mouse scroll wheel scaling with Google Maps API

I am using Google Maps API (v3) to draw a few maps on a page. One thing I'd like to do is disable zooming when you scroll the mouse wheel over the map, but I'm unsure how. I have disabled …

Read More
Change Placeholder Text using jQuery

I am using a jQuery placeholder plugin(https://github.com/danielstocks/jQuery-Placeholder). I need to change the placeholder text with the change in dropdown menu. But it is not changing. Here is the code: $(function () { $('input[placeholder], textarea[placeholder]').…

Read More