Действительно ли возможно предотвратить просто горизонтальную прокрутку, когда переполнение-x скрыто?

Question

Действительно ли возможно предотвратить просто горизонтальную прокрутку, когда переполнение-x скрыто?

У меня есть веб-страница, которая имеет содержание, которое расширяется мимо правого края окна браузера. Я установил overflow-x: hidden на <body> для выключения нижней полосы прокрутки но я могу все еще прокрутить горизонтально с сенсорной панелью, которая не является тем, что я хочу.

Там какой-либо путь состоит в том, чтобы препятствовать тому, чтобы браузер прокрутил горизонтально?

Как примечание стороны: Safari 4.0.4 только прокрутки горизонтально иногда и прокрутка чувствуют себя "липкими" и "нервными", тогда как Firefox всегда гладко прокручивает горизонтально.

7

javascript css overflow hidden

задан Andrew LeClair 15 April 2010 в 19:58

4 ответа

Другие вопросы по тегам:

javascript css overflow hidden

Похожие вопросы:

score 2 · Answer 1

вы можете попробовать установить в CSS:

html{
  overflow-x: hidden;
}

вместо использования селектора body . Я пробовал это и работает в firefox.

score 1 · Answer 2

Если ничего не помогает, вы можете использовать Javascript, чтобы постоянно заставлять браузер выполнять прокрутку влево с помощью window.scrollTo (xpos, ypos). Для xpos вы захотите использовать 0 и ypos, вы захотите получить текущую позицию прокрутки пользователя, предполагая, что вы хотите разрешить вертикальную прокрутку.

Вы можете поместить вызов функции либо в обработчик событий window.onscroll, либо в интервал javascript, который выполняется каждые 100 мс или около того. Вам решать. Если вам нужны примеры кода, просто спросите.

score 0 · Answer 3

Это было бы лучше понять, если бы у вас был пример.

это длинный URL или что-то без пробелов? Установлено ли для элемента white-space: nowrap; ?

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

score 3 · Answer 4

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

Если есть законная причина, по которой вы хотите, чтобы он переполнял контейнер, тогда явно задайте размер контейнера, а затем для параметра overflow-x значение hidden. Я не тестировал это, но это должно предотвратить текущее поведение. Если нет, попробуйте использовать div, а не тег body. Браузеры могут вести себя странно, потому что они работают с самим тегом body.