Beaver13 wrote:
Thank you "etresoft". In fact, I wrote the inappropriate term function, but as I detailed above, I used correctly resizeTo as a method of "what should be a window object". Syntax of the evaluation of this object by open is also correct since the root object window is implicit. Anyway, I tried adding window or this and I obtained the same behavior.
In theory that is true, but it isn't working for you. While I'm quite fond of Javascript, it is a very flexible language and you could have installed any number of 3rd party additions that do all kinds of crazy things with it.
Finally, could you say me how you would open a popup with given dimensions ?
I normally don't use pop-ups but I have one special case where a page is displayed inside of Google Earth. Google Earth isn't a real web browser, but looks like one, so it needs lots of hacks to get some functionality. When the user clicks an image link, it uses this function to pop-up a new window that redirects itself to the appropriate image URL, successfully downloading the requested image instead of the nasty error message the user would have seen otherwise - and no download. I will add a few extra comments to explain what is going on...
// Pass in the id of the item to download.
function embeddedDownloadItem(id)
{
// Center the pop-up in a platform-neutral way.
var top =
window.screenTop
? window.screenTop
: window.screenY;
var left =
window.screenLeft
? window.screenLeft
: window.screenX;
top += $(window).height();
left += $(window).width();
// Move it over a bit.
left -= 200;
// Use the id to construct a selector to
// find and extract the URL.
var url = $('#url-' + id).attr('value');
// Download the file via new window.
downloadWindow =
window.open(
url,
"Download",
'top=' + top + ', left=' + left
+ ',width=200,height=100');
// Close the new window in 5 seconds.
setTimeout("downloadWindow.close();", 5000);
// Hide it until that happens.
window.focus();
}
As you can see, I am using jQuery which does some of that crazy stuff I mentioned earlier. However, that is not something you really want to live without. This is a special case that just pops up a window, redirects to download an image, and then goes away. I actually recommend not using pop-ups at all because they are too easy to block. In this case, it is running out of Google Earth with doesn't have a pop-up blocker, so I lucked out.
I don't know why your code isn't working. Have you tried the demos at w3schools? They are always very handy.
I agree with you, Safari has the best debugging features, but, I'm a little more circumspect about "the most standard compliant", but maybe I'm wrong.
That is just what I have found. I am not really a web developer, but I have been roped into it. Because I don't really enjoy it, I don't have the same obsession towards perfection that I would elsewhere. If I can get it working in the major browsers, that's good enough for me.
I always build in Safari first. The latest Safari has a few more debugging bells and whistles but is actually a bit harder to use in this aspect than the previous version. I build a "clean-room" version of the site in Safari with no hacks of any kind. Everything works as it should in an "ideal" browser, which just happens to be Safari. The console window and "window.console.log()" are your friends. "Inspect element" is very powerful.
I don't bother with Chrome because it is so similar to Safari. I have never seen a significant difference between the two.
Next up is IE7. Parallels to the rescue. Thankfully, I don't have to support IE6 anymore. IE has some very nice, version-specific hacks that allow you retain some of your sanity. I also use Zend which automatically generates these constructs. I can do something like:
$this->view->headLink()->appendStylesheet(
$this->view->baseUrl() . '/css/ie7.css', 'all', 'IE 7');
$this->view->headLink()->appendStylesheet(
$this->view->baseUrl() . '/css/ie8.css', 'all', 'IE 8');
which will generate:
<!--[if IE 7]> <link href="/css/ie7.css" media="all" rel="stylesheet" type="text/css" /><![endif]-->
<!--[if IE 8]> <link href="/css/ie8.css" media="all" rel="stylesheet" type="text/css" /><![endif]-->
Zend supports the same thing with Javascript, with a little bit more mess:
$this->view->headScript()->appendFile(
$this->view->baseUrl() . '/js_include/warning.js',
'text/javascript',
array('conditional' => 'IE 6'));
$this->view->headScript()->appendScript(
sprintf(
'window.onload=function(){e("%s")}',
$this->view->baseUrl() . '/images'),
'text/javascript',
array('conditional' => 'IE 6'));
generates:
<!--[if IE 6]> <script type="text/javascript" src="/js_include/warning.js"></script><![endif]-->
<!--[if IE 6]> <script type="text/javascript">
//<![CDATA[
window.onload=function(){e("/images")} //]]>
</script><![endif]-->
In this example, I just pop-up a warning saying IE6 isn't supported at all.
You can do most of the IE7 and IE8 support with the above CSS hacks. If you need to change the structure to support IE, then once it works in IE you have to go back and re-test in Safari.
I have found that IE9 is much more standards-compliant and needs very little help.
Firefox is actually one of the flakier browsers these days - even more so than IE9. I actually have to add a special section of Firefox hacks at the end of my CSS like this:
/* Firefox hacks */
@-moz-document url-prefix()
{
#kml_loading,
#kmz_loading,
#shapefile_loading
{
top: -1px;
}
...
}
Unfortunately, Firefox wasn't known to be a troublemaker like IE so the hacks are more ugly than in IE.
