Внешний плагин для мыши, заставляющий браузер повторно отображать страницу в Mac OS X?

Основная проблема: подключение внешней мыши заставляет Chrome и Firefox добавлять полосы прокрутки на страницу (которую я создал) в моем браузере. Я пытаюсь понять, почему это так, но с трудом находить информацию. Мы протестировали и воспроизвели проблему на OSX 10.7.5 и 10.8.5.

Моя теория заключается в том, что, поскольку оба браузера реагируют таким образом, последовательность событий выглядит примерно так:

подключить внешнюю мышь.
ОС распознает мышь и отправляет какое-то событие в запущенные приложения.
Запускаемые приложения получают это событие и изменяют рендеринг страницы.

Я различал вычисленные стили обоих состояний, и нет никакой разницы, просто чтобы это исключить. Здесь анимированный gif того, что происходит. единственное, что я делаю, чтобы вызвать изменение, - это подключить внешнюю мышь:

Мой вопрос: какое событие отправляется из ОС в браузер при подключении внешней мыши и как я копаю глубже в том, как это событие обрабатывается?

Ответ 1

Если Im не полностью не понимает вашу проблему, то это не имеет ничего общего с браузером, а скорее является функцией OS X, чтобы скрыть полосы прокрутки (в каждой поддерживаемой программе), пока вы используете устройство ввода, которое не нуждается в полосы прокрутки (например, трекпад MacBooks). Если это так, то полосы прокрутки также должны отображаться, например. Finder с подключенной вами мышью.

Чтобы изменить это поведение, перейдите к System Preferences > General и выберите Always в разделе Show scroll bars.

Ответ 2

Для меня проблема заключалась в том, что использование блоков vw не учитывает ширину полосы прокрутки. Изменение нашего CSS для использования% вместо vw работает (50% против 50vw).

CanIUse.com говорит:

В настоящее время все браузеры, но Firefox неправильно считают 100vw ширина всей страницы, включая вертикальную полосу прокрутки, которая может вызвать горизонтальная полоса прокрутки при переполнении: авто устанавливается.

http://caniuse.com/#feat=viewport-units

См. этот код для доказательства. http://codepen.io/anon/pen/ZGYNWZ попробовать с USB-мышью и без нее.

CSS:

:root, html {
  overflow-x: auto;
  overflow-y: scroll;
}

body {
  margin: 0;
  padding: 0;
}

.thing {
  width: 100vw;
  height: 110vh;
  background: blue;
}

HTML:

<div class="thing">

</div>