Solved

Image Pop Up in new Window (same size as image)

Posted on 2012-03-21
2
244 Views
Last Modified: 2012-04-27
Is there a way to make an image open in a new window showing a larger image of the same image? I want to make the window the same size of the image. I have lots of images (maps) so I hoping to use a javascript of something like (onclick open _blank)
0
Comment
Question by:Turfimage
2 Comments
 
LVL 16

Accepted Solution

by:
Rose Babu earned 200 total points
ID: 37752243
Hi,

get the image's height and width and use the same in the popupwindow property as like below.
<script language="javascript" type="text/javascript">
function imgPopup(imgURL) {
	x = new Image;
	x.src = imgURL;

	imgW = x.width;
	imgH = x.height;

	newwindow = window.open(imgURL, 'name', 'height=' + imgH + ',width=' + imgW + '');
	if (window.focus) {
		newwindow.focus()
	}
}
</script>


<img src="http://whatisprogramming.com/files/2011/10/javascript1.jpg" 
     onclick="imgPopup('http://whatisprogramming.com/files/2011/10/javascript1.jpg')" />

<img src="http://nabtron.com/wp-content/uploads/2011/09/javascript1.png" 
     onclick="imgPopup('http://nabtron.com/wp-content/uploads/2011/09/javascript1.png')" />

Open in new window

Hope this will work for you.
0
 

Author Comment

by:Turfimage
ID: 37904060
Yes this works.... Is there a way to make the new window pop up be ' resizable=yes '
  and add a 'menubar=yes' In this script?
0

Featured Post

Maximize Your Threat Intelligence Reporting

Reporting is one of the most important and least talked about aspects of a world-class threat intelligence program. Here’s how to do it right.

Join & Write a Comment

In this article you'll learn how to use Ajax calls within your CodeIgniter application. To explain this, I'll illustrate how to implement a simple contact form to allow visitors to send you an email through your web site.
Although it can be difficult to imagine, someday your child will have a career of his or her own. He or she will likely start a family, buy a home and start having their own children. So, while being a kid is still extremely important, it’s also …
The viewer will learn how to dynamically set the form action using jQuery.
The viewer will get a basic understanding of what section 508 compliance can entail, learn about skip navigation links, alt text, transcripts, and font size controls.

747 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

Need Help in Real-Time?

Connect with top rated Experts

13 Experts available now in Live!

Get 1:1 Help Now