Popup image code using jQuery

Asked By devinpaytonn 0 points N/A Posted on - 08/22/2012

I wants to display a popup image by using the jQuery language.

Quote the solution how can i do this.

• Status: Open
• Question Views: 1125
• Answer Count: 2
• Vote Up 0 Vote Down

• Answer Accepted: Yes
• Question Category: Query Syntax

Best Answer by Sharath Reddy

Go To Solution

Answered By Hathy greave 0 points N/A #159689

Popup image code using jQuery

Hi,

I think you are familiar with jQuery. So, just do the following to display a popup image:

Create a link element first.

Give the link a class attribute with a value of thickbox (class = "thickbox")

Provide a path in the href attribute to an image file (.jpg .jpeg .png . bmp)

Now show your popup image.

Is it helpful?

Thanks for asking.

Hathy

About Hathy greave

Questions
2

Answers
147

Best Answers
27

• Vote Up 0 Vote Down

• Posted on - 08/22/2012
• Question Category: Query Syntax

Best Answer

Best Answer

Answered By Sharath Reddy 590495 points N/A #159690

Popup image code using jQuery

Since you want an image that pops up using jQuery, you can use ThickBox to accomplish it. Actually, besides using ThickBox, there are also other methods you can use to achieve this like for example you can use LightBox, FaceBox, FancyBox, PiroBox, and NyroModal. But here, I’ll explain ThickBox. ThickBox was created using super lightweight jQuery library. Its uncompressed size is only around 58k and when compressed, it is only around 20k.

Its function is to resize an image or images that are bigger than the browser window and gives flexibility. It can hide form elements in Microsoft Internet Explorer 6 and the box remains centered in the window even if you adjust the size of the web browser or scroll the page up or down. ThickBox will close if you click the overlay, or click the “close” link, or simply click the image. As much as I want to display here the full contents of the scripts, it would occupy too much space. The best way to learn it yourself is to download the demo from Ajax Daddy | jQuery ThickBox.

About Sharath Reddy

Questions
1

Answers
14599

Best Answers
2290

• Vote Up 0 Vote Down

• Posted on - 06/03/2013
• Question Category: Query Syntax