Javascript Opening New Window

Question

I'm sorry if this question has been asked before,

I'm just curious with my code:

function showPopup(file,wdth,hght) {
//height = 768 width = 1024
var w = wdth;
var h = hght;

var winWidth = w+'px';
var winHeight = h+'px';
var winTop = (screen.height/2)-(h/2);
var winLeft = (screen.width/2)-(w/2);

window.open(file,'Upload','top='+winTop+',left='+winLeft+',width='+winWidth+',height='+winHeight+',toolbar=1,resizeable=1,statusbar=1,scrollbar=1,location=1, fullscreen=1');

}

Then I run it with HTML:

<input type="button" onClick="showPopup('preview.php', '1000', '1000')" value="Priview">

The opening window still donsn't have toolbar, statusbar, scrollbar, etc as I set inside my function.

Anybody help me what's wrong with my code? Thx

add console.log('top='+winTop+',left='+winLeft+',width='+winWidth+',height='+winHeight+',toolbar=1,resizeable=1,statusbar=1,scrollbar=1,location=1, fullscreen=1') and show us what pops out. — 000, Mar 15 '13 at 04:02
I'm sorry Joe, what do you mean console.log? If you mean error log, it doesn't give any error. — Plipus Tel, Mar 15 '13 at 04:27
If you're using Chrome, hit F12 for the console. In Firefox there's an inspector somewhere. `console.log` will output to that console. — 000, Mar 15 '13 at 04:28
Pressing F12 just show me the CSS and I can't do nothing from the console, i've try remove all my css to make sure it clean from effected styling. Unfortunately, it doesn't work. However i've found some issue due to this issue. Finally i just make a simplification (trick) with css to show the scrollbars (Although I know this isn't an effective solution). Actually I just need scrollbars. — Plipus Tel, Mar 15 '13 at 05:10

Paul Calabro · Answer 1 · 2013-03-15T04:43:01.880

1

<html>
        <head>
                <title>Test Website</title>
                <script src="https://ajax.googleapis.com/ajax/libs/jquery/1.9.1/jquery.min.js"></script>
                <script>
                        function showPopup(file,wdth,hght) {
                        //height = 768 width = 1024
                        var w = wdth;
                        var h = hght;

                        var winWidth = w;
                        var winHeight = h;
                        var winTop = (screen.height/2)-(h/2);
                        var winLeft = (screen.width/2)-(w/2);
                        window.open(file,'Upload','top='+winTop+',left='+winLeft+',width='+winWidth+',height='+winHeight+',toolbar=1,resizeable=1,statusbar=1,scrollbar=1,location=1, fullscreen=1');
                        }
                </script>
        </head>
<body>

        <input type="button" onClick="showPopup('preview.php', '500', '500')" value="Priview">


</body>
</html>

edited Mar 15 '13 at 04:43

answered Mar 15 '13 at 04:05

Paul Calabro

1,748
1
16
33

Thank you Paul.. I've try to remove 'px' from the units and try following you code, but it dosen't work. Where is exactly my wrong code? Make me frustated – Plipus Tel Mar 15 '13 at 04:25
Glad to help. The code above (edited) works perfectly for me! (tested in FF and Chrome) – Paul Calabro Mar 15 '13 at 04:42
Just found the following accepted answer in another SO post: Unfortunately Chrome only supports a small set of window features when using window.open. If you believe that this is a bug or an issue you can file it at http://crbug.com. (http://stackoverflow.com/questions/2568064/how-to-window-open-with-a-toolbar-in-google-chrome) – Paul Calabro Mar 15 '13 at 04:47
Just found this for FF in a related SO post: This should do it: window.open("http://example.com", "name", "scrollbars=1,width=100,height=100"); but note that Firefox will only show scrollbars when the content is larger than the window. To force Firefox to always show a scrollbar (like Internet Explorer does) you need this in the stylesheet of the HTML that's being shown in the popup: html { overflow: -moz-scrollbars-vertical; } (http://stackoverflow.com/questions/1163275/how-to-use-window-open-to-create-with-scrollbar-in-firefox) – Paul Calabro Mar 15 '13 at 04:48
Another SO post saying that FF disabled adjusting the statusbar: http://stackoverflow.com/questions/2909645/open-new-popup-window-without-address-bars-in-firefox-ie ... it honestly seems like the cross browser support might be iffy for this. – Paul Calabro Mar 15 '13 at 04:51
Regarding my previous answer saying everything looked fine-- I was taking into account the statusbar and scrollbars – Paul Calabro Mar 15 '13 at 04:53
Thank you again Paul... Yes you are right, I also think this issue due to the browsers being used, I use FF ver. 19.0.2, trying you code and it works perfectly, however as you said the statusbar couldn't be adjusted and it's also invisible. Finally, I trick it with CSS. :-) – Plipus Tel Mar 15 '13 at 05:03
Fantastic, glad to hear! :) – Paul Calabro Mar 15 '13 at 05:06
If you wouldn't mind, could you please mark this as the accepted answer when you get a chance! Thanks! :) – Paul Calabro Mar 15 '13 at 06:04

score 0 · Answer 2 · answered Mar 15 '13 at 04:31

0

the second parameter ('name') is 'Upload' - it should be '_blank'

or one of the other supported values mentioned here: http://www.w3schools.com/jsref/met_win_open.asp

Paul Calabro is also right, you do not need the "px" units.

answered Mar 15 '13 at 04:31

Mupps

346
1
6

Javascript Opening New Window

2 Answers2