PDA

View Full Version : New window opens to a custom size



pixel1
09-08-2006, 03:33 PM
Hi everyone, first time on this forum, hope you guys can help me out. I'm new to scripting, my question is, when i click a link, I would like the link to open in a new window with my desired size, which would be 800 X 600 pixels, how can i do this? Can someone direct me to a tutorial? I've searched sites and this forum but found nothing. I hope i'm posting this in the right section.

thanks
mike

pixel1
09-08-2006, 06:11 PM
an example here:
http://www.wrightair.co.uk/mainpages/digitalpage.htm

mburt
09-08-2006, 06:47 PM
<a href="#" onclick="window.open('http://www.google.ca/','newWin','width=800,height=600')">Google.ca</a>

pixel1
09-08-2006, 06:49 PM
thankyou very very much mike!


mike

mwinter
09-08-2006, 06:54 PM
'width=800,height=600'

You've omitted the resizable and scrollbars features, which should always be present.



'width=800,height=600,resizable,scrollbars'

Ideally though, the OP would forego a new window entirely.

Mike

mburt
09-08-2006, 07:10 PM
Yes, I realize that the scrollbars would be omitted. Actually, any parameters that it has will automically be null if not defined. :p

mwinter
09-08-2006, 07:18 PM
... any parameters that it has will automically be null if not defined.

There are some exceptions, but yes, in general, an omitted boolean feature will be considered 'false'. However, that's my point: neither scrollbars nor resizable should ever be omitted. If the window size is misjudged (and that can always happen), then the user will either need to scroll or resize the window to view the clipped content.

Mike

mburt
09-08-2006, 07:30 PM
I agree completely :)

pixel1
09-08-2006, 08:46 PM
ok kewl, i'll try both

pixel1
09-12-2006, 02:51 PM
Hi, i tried the script, it works, but the original redirects to a page that says NOT FOUND...

here
http://www.pixel1studios.com/

jscheuer1
09-12-2006, 03:39 PM
When running the window.open method on a link, you should return false unless you want the link itself to also fire (generally a bad idea but could be a good thing sometimes). In which case you should return true, just to be sure that the link will fire.

Also, consider the plight of users with no javascript enabled. For a simple open in new window of specified dimensions, this is pretty good:


<a href="http://www.google.com" target="_blank" onclick="window.open(this.href,this.target,'width=400,height=300,resizeable,scrollbars');return false;">Link Text or Image Tag</a>

With no javascript, at least most users still get a new window with the content specified, just without the specified dimensions.

With pop up blocking, both the javascript and the non-javascript new window may be blocked.

mwinter
09-12-2006, 05:00 PM
Did Yahoo! PageBuilder generate all of that markup, or was something else responsible? You might want to consider replacing it all with something like:



<!DOCTYPE html PUBLIC "-//W3C//DTD HTML 4.01//EN" "http://www.w3.org/TR/html4/strict.dtd">

<html>
<head>
<title>Pixel 1</title>

<style type="text/css">
body {
background: #bcced6;
color: #000000;
min-height: 398px;
margin: 0;
padding: 0;
}
a:link, a:visited, a:link:hover, a:visited:hover {
background: transparent;
}
a:link, a:link:hover {
color: #0000ff;
}
a:visited, a:visited:hover {
color: #ff0000;
}
a img {
border: none;
vertical-align: top;
}

#portal {
margin-left: -139px;
margin-top: -199px;
position: absolute;
left: 50%;
top: 50%;
}
</style>
</head>

<body>
<div id="portal">
<a href="http://www.pixel1studios.com/home.html"
onclick="return !window.open(this.href, 'studio', 'width=800,height=600,resizable,scrollbars');"
><img alt="Welcome to Pixel 1 Studios" src="space-robot.jpeg"></a>
</div>
</body>
</html>

In that document, the space-robot.jpeg is a single image (don't use image slicing: it's a waste of bandwidth). It also has the advantage of actually centring the image in standards-compliant browsers like Firefox and Opera.

There is one issue with that form of centring, though: if the viewport is too small, a browser that doesn't support the min-height property (like MSIE) will clip the content. This isn't much of an issue here as the image is relatively small. As an alternative, the absolute positioning can be replaced by a top margin and the image can be centred as normal in-line content using the text-align property.

Mike

pixel1
09-13-2006, 02:23 PM
hey thanks alot mike, i'll try it out then get back to you! it's yahoo page builder generated it.


mike