Geek asks and answers

How to find using javascript the maximum width of the browser window and the current

I am looking for a way to use javascript to find the width and height of the browser window of visitors, but I also want to find the maximum window sizes, so if the user makes the window smaller or larger, some elements change their automatic position or size, for example facebook chat. Any suggestions?

+5
source share
4 answers

The maximum width of the browser will be equal to the width and height of the screen:

screen.height;
screen.width;

But I would use CSS queries for multimedia for what you are trying to do:

http://css-tricks.com/css-media-queries/

Something like this will make a black and white page if the window width is less than 500 pixels:

@media only screen and (max-width: 500px) {
  body {
    background: #000;
  }
}

Update:

, polyfill , -:

https://github.com/scottjehl/Respond

- IE6!

+6

window.screen.availHeight - (window.outerHeight - window.innerHeight)
+4

You can use window.innerWidthandwindow.innerHeight

You can place any dom element relative to the window using the position css 'fixed' or absolute, so that when the window is resized, the will is rebuilt.

You can use the window.onresizewindow resize event to listen

jQuery equivalent

$(window).width(); $(window).height() and $(window).resize(function(){});

0
source

If you can use jQuery, it's pretty easy to set up the listener in a cross browser:

$(window).resize(function() {
  alert($(window).width()) //window width
  alert($(window).height()) //window height
}).trigger("resize") //to ensure that you do whatever you're going to do when the window is first loaded;
0
source

More articles:


All Articles