CODEWITHSUNDEEP
htmlcssbrowser
BruceyBandit
BruceyBandit

Reputation: 4324

I don't want pop up window to be resizable

I have a popup window which appears after clicking on a button. I don't want the pop up window though to be resizeable. I tried using in css resize:none and resizable:none but this does not work for all browsers.

Is there a css element that can be used so that pop window can not resizable in all browsers, or is there a lot of different ressizeable related css elements so that I can use them so eventually all pop up windows are not resizable in all broswers?

I know where to put the css elements, in the window.open function, I just want to know other css ways that can make pop up windows not resizable for all browsers

Browsers using (all latest browsers): IE, Firefox, Google Chrome, safari and Opera

Upvotes: 6

Views: 63211

Answers (3)

Verminous
Verminous

Reputation: 555

Better late than never. Got this working:

window.addEventListener('load', () => {
  const popup = window;
  console.log(popup);
  popup.addEventListener("resize", () => {
    popup.resizeTo(306, 512);
  })
});

Upvotes: 0

James Hill
James Hill

Reputation: 61793

You can't do this with CSS - you need to pass the resizable parameter to your window.open() function. If you're using an anchor with the target attribute, you need to use JavaScript instead.

JS Example

window.open ("http://URL","mywin","menubar=1,resizable=0,width=350,height=250");

JS & HTML Example

<a href="#"
  onclick="window.open ('http://URL','mywin','resizable=0,width=350,height=250')">Open</a>

Additional Resources

Take a look at the window.open docs on MDN: https://developer.mozilla.org/en/DOM/window.open

According to MDN, Firefox will not support the resizable attribute:

resizable

If this feature is set to yes, the new secondary window will be resizable. Note: Starting with version 1.4, Mozilla-based browsers have a window resizing grippy at the right end of the status bar, this ensures that users can resize the browser window even if the web author requested this secondary window to be non-resizable. In such case, the maximize/restore icon in the window's titlebar will be disabled and the window's borders won't allow resizing but the window will still be resizable via that grippy in the status bar.

Starting with Firefox 3, secondary windows are always resizable ( bug 177838 )

Upvotes: 11

Patricia
Patricia

Reputation: 7802

Firefox doesn't support this.

have a look here:

how can we disable resizing of new popup window in firefox?

futher more, it's a bad idea to make it not-resizeable. what if your users are visually impaired have have there settings to have large fonts?

Upvotes: 2

Related Questions