Làm cách nào để tìm kiếm bằng cách sử dụng javascript chiều rộng cửa sổ trình duyệt tối đa của người dùng và hiện tại

Question

Tôi đang tìm kiếm bằng cách sử dụng javascript để tìm khách truy cập chiều rộng và chiều cao cửa sổ trình duyệt nhưng tôi cũng muốn tìm kích thước cửa sổ tối đa để người dùng làm cửa sổ nhỏ hơn hoặc lớn hơn một số yếu tố thay đổi vị trí hoặc kích thước tự động như trò chuyện trên facebook. Bất kỳ đề xuất ?

Answer 1

Bạn có thể sử dụng window.innerWidth và window.innerHeight

Bạn có thể xác định vị trí bất kỳ yếu tố dom so với cửa sổ sử dụng vị trí css 'cố định' hoặc tuyệt đối để vào cửa sổ thay đổi kích thước sẽ điều chỉnh bản thân.

Bạn có thể sử dụng window.onresize nghe cửa sổ thay đổi kích thước kiện

jQuery tương đương

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

Answer 2

Kích thước trình duyệt chiều rộng tối đa sẽ là chiều rộng và chiều cao của màn hình:

screen.height; 
screen.width; 

Nhưng tôi muốn sử dụng truy vấn phương tiện CSS cho những gì bạn đang cố gắng làm:

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

Something như thế này sẽ làm cho nền trang màu đen nếu cửa sổ nhỏ hơn 500px rộng:

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

Cập nhật:

Oh, và bạn sẽ muốn có một polyfill cho các trình duyệt cũ hơn không hỗ trợ truy vấn phương tiện:

https://github.com/scottjehl/Respond

Điều đó sẽ giúp bạn truy vấn phương tiện thông qua IE6!

Answer 3

Nếu bạn có thể sử dụng jQuery, nó khá dễ dàng để thiết lập một người biết lắng nghe một cách qua trình duyệt:

$(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; 

Answer 4

chiều cao cửa sổ tối đa là

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