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 SkipVought on being selected by the Tek-Tips community for having the most helpful posts in the forums last week. Way to Go!

window.open problem 1

Status
Not open for further replies.
Nov 7, 2004
15
0
0
US
I am displaying several images on a page and I would like to be able to click on the image and open a new window with no toolbar, no browser, no scrollbar, etc. I am not using a style sheet and it seems that all of the example code I find calls for that. Can someone please help me with this? I am sure I need some sort of function at the top of the page but how do you have the function and use that same function for several different images?
 
In the head:

Code:
<script type="text/javascript">
<!--

function openWindow(url, caption)
{
  var newwin = window.open("about:blank","imagewindow","location=no,menubar=no,status=no,directories=no,scrollbars=no,toolbar=no");
  newwin.document.writeln("<html>");
  newwin.document.writeln("<body>");
  newwin.document.writeln("<img src=\""+url+"\"><br>");
  newwin.document.writeln("<h5>"+caption+"</h5>");
  newwin.document.writeln("</body>");
  newwin.document.writeln("</html>");
}

// -->
</script>

In the body:
Code:
<a href="myimage.jpg" onclick="openWindow(this.href,'This is one of my pictures');return false;"><img src="myimage.jpg"></a>


--Chessbot

"See the TURTLE of enormous girth!"
-- Stephen King, The Dark Tower series
 
I added the code and it doesn't seem to be opening in a new window. This is what I have in the code.


This is my heading.....


<head>
<title>Sherry Lea Ferguson, Artist</title>
<meta http-equiv="Page-Enter" content="revealTrans(Duration=1,Transition=3)">

<script type="text/javascript">
<!--

function openWindow(url, caption)
{
var newwin = window.open("about:blank","imagewindow","top=0,left=0,location=no,menubar=no,status=no,directories=no,scrollbars=no,toolbar=no");
newwin.document.writeln("<html>");
newwin.document.writeln("<body>");
newwin.document.writeln("<img src=\""+url+"\"><br>");
newwin.document.writeln("<h5>"+caption+"</h5>");
newwin.document.writeln("</body>");
newwin.document.writeln("</html>");
}

// -->
</script>

</head>


I have this in the body....


<a href="warmsurf.html" onclick="openWindow(this.href,'This is one of my pictures');return false;"><img src="images/water/warmsurf2.jpg" width="204" height="150" alt="" border="0"></a>
 
The code, as you have it, will open a blank window. You're passing in a relative reference to a page (warmsurf.html). The way chessbot set the code up for you was to pass the url of an image in, such as like this:

Code:
openWindow('[URL unfurl="true"]http://www.tek-tips.com/images/logo.gif',[/URL] 'Tek-Tips');

However, you are passing in a full HTML document. If you'd like to open an existing document, simply pass the url in as you are doing (this.href) and then open it like this:

Code:
function openWindow(url, caption)
{
  var newwin = window.open(url,"imagewindow","top=0,left=0,location=no,menubar=no,status=no,directories=no,scrollbars=no,toolbar=no");
}

*cLFlaVA
----------------------------
Lois: "Peter, you're drunk!"
Peter: "I'm not drunk, I'm just exhausted from stayin' up all night drinking!
 
Yes. Thank you, cLFlaVA.

--Chessbot

"See the TURTLE of enormous girth!"
-- Stephen King, The Dark Tower series
 
How come I am getting this message at the top of my screen when I am trying to test this code???

"To help protect your security, Internet Explorer has restricted this file from showing active content that could access your computer. Click here for option"

That is where I have to click to allow the pop-ups.
Is there something wrong with the code or is this some kind of security setting that I have on my computer?
 
This is probably local on your own computer, isn't it? If you're using IIS to display the page, then you need to add 127.0.0.1, or whatever the local domain name is, to your safe site list. I just checked, and the popup blocker doesn't allow file:/// entries into the safe site list.

Lee
 
Is this correct way to set the width and height of the window I am opening since I have several images on the page that will open several different sized windows? This is just for one of the images.

openWindow('illuminated.html', 'Illuminated', 'width=450, height=550');
 
Code:
[red]window.open[/red]('illuminated.html', 'Illuminated', 'width=450, height=550');

--Chessbot

"See the TURTLE of enormous girth!"
-- Stephen King, The Dark Tower series
 
Here is my code for one row of my table.

<tr>
<td width="10%">&nbsp;</td>
<td width="40%" align="center"><font size="2" face="Lucida Calligraphy" color="#ffffff"><b><a href="water.html" onclick="window.open('warmsurf.html', 'Warm Surf', 'width=475, height=590');"><img src="images/water/warmsurf2.jpg" width="204" height="150" alt="" border="0"></a><br>"Warm Surf"<br>30" w x 22" h</b></font></td>
<td width="40%" align="center"><font size="2" face="Lucida Calligraphy" color="#ffffff"><b><a href="water.html" onclick="window.open('illuminated.html', 'Illuminated', 'width=475, height=590');"><img src="images/water/illuminated2.jpg" width="109" height="150" alt="" border="0"></a><br>"Illuminated"<br>18" w x 24 1/2" h</b></font></td>
<td width="10%">&nbsp;</td>
</tr>

Why would the first image not open in a new window but the second will?
 
The second parameter to [tt]window.open[/tt] is the name of the window. Try not using spaces.

--Chessbot

"See the TURTLE of enormous girth!"
-- Stephen King, The Dark Tower series
 
Here is my script for opening my new window. It opens but is not opening in the top left corner. How come??

<script type="text/javascript">
<!--

function openWindow(url, caption)
{
var newwin = window.open(url,"imagewindow","top=0,left=0,location=no,menubar=no,status=no,directories=no,scrollbars=no,toolbar=no");
}
// -->
</script>


 
Works fine for me (in IE). What browser are you using?

--Chessbot

"See the TURTLE of enormous girth!"
-- Stephen King, The Dark Tower series
 
Try adding in width=x,height=x properties to the parameters. What varsion of IE? Do you have some sort of popup blocker on?

--Chessbot

"See the TURTLE of enormous girth!"
-- Stephen King, The Dark Tower series
 
First let me tell you "Thank you" for all the help you have given me so far....but I have some more questions.
This popup window thing is a problem with all the blockers that are out there. I have noticed that some websites use
createpopup() instead of window.open(). Does this allow the popups through the blocker? If so, how do I use that? The page that the code will be in is water.html. The image that I will use as the link is warmsurf.jpg. And the name of the html window that will open from that link is warmsurf.html. Since this site that I am creating will have about 50 images that open into larger images when you click on the link, I don't want someone to have to turn off their popup to allow all of those through. Would it be smarter to just make the link open in a new or next page to view the larger image and the description and have a back button on that page to get back to what the user was viewing before??
 
You would need some kind of popup blocking tester, like this:
Code:
var blocked = false;
var newwin = window.open("","test","width=0,height=0");
if (newwin)
{
  newwin.close();
}
else
{
  blocked = true;
}
function openWin(url)
{
  if (!blocked)
    window.open(url,"picwin","width=100,height=100,top=0,left=0);
  else
    location.replace(url);
}

The createWindow functions would be defined somewhere in the page.

--Chessbot

"See the TURTLE of enormous girth!"
-- Stephen King, The Dark Tower series
 
Do I put that code in my script instead or add it to the script that I already have here?


<script type="text/javascript">
<!--

function openWindow(url, caption)
{
var newwin = window.open(url,"imagewindow","top=0,left=0,location=no,menubar=no,status=no,directories=no,scrollbars=no,toolbar=no");
}
// -->
</script>
 
Your entire script:
Code:
<script type="text/javascript">
<!--

var blocked = false;
var newwin = window.open("","test","width=0,height=0");
if (newwin)
{
  newwin.close();
}
else
{
  blocked = true;
}
function openWindow(url, caption)
{
  if (!blocked)
     var newwin = window.open(url,"imagewindow","top=0,left=0,location=no,menubar=no,status=no,directories=no,scrollbars=no,toolbar=no");
  else
    location.replace(url);
}

// -->
</script>

--Chessbot

"See the TURTLE of enormous girth!"
-- Stephen King, The Dark Tower series
 
Status
Not open for further replies.

Part and Inventory Search

Sponsor

Back
Top