Подтвердить что ты не робот

Как изменить размер окна браузера, чтобы внутренняя ширина была конкретным значением

Если вы просто здесь, чтобы рассказать мне, почему изменение размера окна - плохая идея, неприятная и веб-эквивалент гвоздей на доске, пожалуйста, уходите. Я ищу решение, а не лекцию. Это должно использоваться только в настройках интрасети. В частности, чтобы отлаживать, а затем демонстративно реагировать на веб-сайты (сайты, которые используют медиа-запросы для масштабирования) для клиентов для просмотра через веб-встречу. Я хочу продемонстрировать конкретные точки разрыва. Это не должно быть развязано широкой публике.

Что я уже знаю:

  • Вы можете изменять размер и положение окон, открытых через javascript, а не пользователем. (если они не корректируют свои настройки безопасности, что не является вариантом)
  • Когда вы используете метод resizeTo(), размер браузера изменяется до указанных размеров. Видовой экран часто значительно меньше (например, в среднем от 30 до 100 пикселей). Однако я хочу изменить размер окна просмотра до определенного размера.
  • Браузер, версия браузера, платформа, некоторые плагины и различные меню и панели инструментов изменят размеры видовых экранов. Больше меню и панели инструментов означает, что ширина окна просмотра меньше.

Возможное решение:

  • Найдите ширину и высоту браузера
  • Найдите ширину окна просмотра и высота
  • Определите разницу между двумя.
  • Отрегулируйте значения в моем вызове для resizeTo() соответственно

Мне нужна помощь с шагом 1. Все остальное я могу понять. Я также использую jQuery и модернизатор, если это помогает.

Заранее благодарим за помощь!

4b9b3361

Ответ 1

Сообщение довольно старое, но вот конкретная реализация для будущих читателей:

var resizeViewPort = function(width, height) {
    if (window.outerWidth) {
        window.resizeTo(
            width + (window.outerWidth - window.innerWidth),
            height + (window.outerHeight - window.innerHeight)
        );
    } else {
        window.resizeTo(500, 500);
        window.resizeTo(
            width + (500 - document.body.offsetWidth),
            height + (500 - document.body.offsetHeight)
        );
    }
};

И если вы хотите принять во внимание полосы прокрутки:

var resizeViewPort = function(width, height) {
    var tmp = document.documentElement.style.overflow;
    document.documentElement.style.overflow = "scroll";

    if (window.outerWidth) {
        window.resizeTo(
            width + (window.outerWidth - document.documentElement.clientWidth),
            height + (window.outerHeight - document.documentElement.clientHeight)
        );
    } else {
        window.resizeTo(500, 500);
        window.resizeTo(
            width + (500 - document.documentElement.clientWidth),
            height + (500 - document.documentElement.clientHeight)
        );
    }

    document.documentElement.style.overflow = tmp;
};

Удачи...