Tek-Tips is the largest IT community on the Internet today!

Members share and learn making Tek-Tips Forums the best source of peer-reviewed technical information on the Internet!

  • Congratulations biv343 on being selected by the Tek-Tips community for having the most helpful posts in the forums last week. Way to Go!

Newbie Question on Pop-up Window

Status
Not open for further replies.

Ineedjava

Technical User
Apr 14, 2001
21
US
Hi, I'm new here. My goal is to use javascript so that when a small thumbnail image is clicked on, the larger version of the image is displayed in a separate pop-up window.

Gee, it seems simple enough. When I use the code for this task (borrowed from the free website below) and run it from my local hard drive, then the small thumbnail image will be displayed but the large image will not be displayed in the pop up window. (In the popup window I get the "Cannot find server. ...The page cannot be displayed" error in IE 5.0) Very frustrating, and I have the jpeg images labeled correctly and stored in the same directory as the web page.

Well, here is the link to the original javascript code:
And below is the code as modified for use with locally stored files named small.jpg (thumbnail image), and large.jpg (large image).

<html>

<head>
<meta http-equiv=&quot;Content-Language&quot; content=&quot;en-us&quot;>
<meta http-equiv=&quot;Content-Type&quot; content=&quot;text/html; charset=windows-1252&quot;>
<meta name=&quot;GENERATOR&quot; content=&quot;Microsoft FrontPage 4.0&quot;>
<meta name=&quot;ProgId&quot; content=&quot;FrontPage.Editor.Document&quot;>
<title>Popup Window Image Preview</title>
<script language=&quot;javascript&quot;>
<!-- hide from old browsers
function selectWin(source,h1,w1){
newWin = window.open(source,'','height=' + h1 + ',width=' + w1 + ',top=10,left=0');
}
// stop hiding -->
</script>
</head>

<body>

<p><a href=&quot;javascript:selectWin('_blank.htm?image=large.jpg&height=276&width=500',276,500)&quot;><img border=&quot;2&quot; src=&quot;small.jpg&quot; alt=&quot;large.jpg (24095 bytes)&quot; width=&quot;100&quot; height=&quot;55&quot;></a></p>

</body>

</html>
 
just replace the '_blank.htm?image=large.jpg&height=276&width=500' with the image file like this.

<html>

<head>
<meta http-equiv=&quot;Content-Language&quot; content=&quot;en-us&quot;>
<meta http-equiv=&quot;Content-Type&quot; content=&quot;text/html; charset=windows-1252&quot;>
<meta name=&quot;GENERATOR&quot; content=&quot;Microsoft FrontPage 4.0&quot;>
<meta name=&quot;ProgId&quot; content=&quot;FrontPage.Editor.Document&quot;>
<title>Popup Window Image Preview</title>
<script language=&quot;javascript&quot;>
<!-- hide from old browsers
function selectWin(source,h1,w1){
newWin = window.open(source,'','height=' + h1 + ',width=' + w1 + ',top=10,left=0');
}
// stop hiding -->
</script>
</head>

<body>

<p><a href=&quot;javascript:selectWin('large.jpg',276,500)&quot;><img border=&quot;2&quot; src=&quot;small.jpg&quot; alt=&quot;large.jpg (24095 bytes)&quot; width=&quot;100&quot; height=&quot;55&quot;></a></p>

</body>

</html>

 
Status
Not open for further replies.

Part and Inventory Search

Sponsor

Back
Top