Определить окно браузера Развернуто / свернуто с помощью Javascript

Question

Когда пользователь нажимает кнопки развернутого / восстановленного вниз или свернутого в браузере, есть ли способ отслеживать эти события с помощью javascript? Есть ли подходящее событие или свойство для использования?

Я хочу, чтобы, когда пользователь нажимал кнопку «развернутый» в правом верхнем углу браузера, веб-страница должна растягиваться на определенную ширину, а когда браузер находится в режиме изменения размера, веб-страница изменяет размер.

Пожалуйста, кто-нибудь может мне помочь в этом? Я не против ни Javascript, ни JQuery.

Заранее спасибо.

Answer 1

Похоже, вам нужен макет, который изменяет размер при изменении размера браузера, но только до максимальной ширины.

Если это так, вы можете сделать это либо в CSS, либо в JavaScript.

Представляя, что ваш контент находится в таком элементе, как:

<div class="container"> -content here- </div>

Мой предпочтительный вариант - использовать CSS следующим образом:

.container{
    max-width: 1200px;
    width: 100%;
}

Если вам требуется поддержка IE6 (который не поддерживает max-width) вы можете попробовать использовать выражение в CSS IE6:

.container{
    width:expression(document.body.clientWidth > 1200 ? "1200px" : "100%" ); /*IE6*/
}

Если вы хотите использовать JavaScript: вы можете просто изменить размеры своих элементов в событии resize окна:

$(window).bind('resize', function() {
    // resize $('.container').width() based on $(window).width()
});

Сначала вы можете запустить эту логику, используя

$(window).trigger('resize');