Да, в некотором роде.
Когда вы задаете вопрос: «Можно ли каким-либо образом удалить полосы прокрутки браузера, а не просто скрыть или скрыть их», все скажут: «Невозможно»"потому что невозможно удалить полосы прокрутки из всех браузеров совместимым и кросс-совместимым способом, и тогда есть целый аргумент юзабилити.
Однако, можно предотвратитьбраузеру больше не нужно генерировать и отображать полосы прокрутки, если вы не допускаете переполнения своей веб-страницы.
Это просто означает, что мы должны заранее заменить то же поведение, которое браузер обычно делает для нас, и сказатьбраузер спасибо, но нет, спасибо, приятель.Вместо того, чтобы пытаться удалить полосы прокрутки (которые, как мы все знаем, невозможно), мы можем избежать прокрутки (вполне выполнимо) и прокрутки в элементах, которые мы создаем, и иметь больший контроль над ними.
Создать div с скрытым переполнением.Определите, когда пользователь пытается прокрутить, но не может, потому что мы отключили возможность прокрутки в браузерах с переполнением: скрытый ... и вместо этого перемещаем содержимое вверх с помощью JavaScript, когда это происходит.Тем самым создаем собственную прокрутку без прокрутки по умолчанию в браузерах или используем плагин, такой как iScroll .
---
Ради тщательности;все специфичные для поставщика способы манипулирования полосами прокрутки:
Internet Explorer 5.5 +
* Эти свойства никогда не были частью спецификации CSS, и при этом они никогда не были одобрены или префикс поставщика не был,но они работают в Internet Explorer и Konqueror.Они также могут быть установлены локально в таблице стилей пользователя для каждого приложения.В Internet Explorer вы найдете его на вкладке «Специальные возможности», в Konqueror на вкладке «Таблицы стилей».
body, html { /* These are defaults and can be replaced by hexadecimal color values */
scrollbar-base-color: aqua;
scrollbar-face-color: ThreeDFace;
scrollbar-highlight-color: ThreeDHighlight;
scrollbar-3dlight-color: ThreeDLightShadow;
scrollbar-shadow-color: ThreeDDarkShadow;
scrollbar-darkshadow-color: ThreeDDarkShadow;
scrollbar-track-color: Scrollbar;
scrollbar-arrow-color: ButtonText;
}
Начиная с Internet Explorer 8 эти свойства были вендором Microsoft с префиксом поставщика, но они все еще не были утверждены W3C .
-ms-scrollbar-base-color
-ms-scrollbar-face-color
-ms-scrollbar-highlight-color
-ms-scrollbar-3dlight-color
-ms-scrollbar-shadow-color
-ms-scrollbar-darkshadow-color
-ms-scrollbar-base-color
-ms-scrollbar-track-color
Дополнительные сведения об Internet Explorer
Internet Explorer делает доступным scroll, который устанавливает, следует ли отключать или включать полосы прокрутки;его также можно использовать для получения значения положения полос прокрутки.
В Microsoft Internet Explorer 6 и более поздних версиях, когда вы используете объявление !DOCTYPE для указания режима, соответствующего стандартам, этот атрибут применяется кэлемент HTML.Если режим совместимости со стандартами не указан, как в более ранних версиях Internet Explorer, этот атрибут применяется к элементу BODY, NOT к элементу HTML.
Стоит также отметитьчто при работе с .NET класс ScrollBar в System.Windows.Controls.Primitives в среде Presentation отвечает за отображение полос прокрутки.
http://msdn.microsoft.com/en-us/library/ie/ms534393(v=vs.85).aspx
WebKit
Расширения WebKit, относящиеся к настройке полосы прокрутки:
::-webkit-scrollbar {} /* 1 */
::-webkit-scrollbar-button {} /* 2 */
::-webkit-scrollbar-track {} /* 3 */
::-webkit-scrollbar-track-piece {} /* 4 */
::-webkit-scrollbar-thumb {} /* 5 */
::-webkit-scrollbar-corner {} /* 6 */
::-webkit-resizer {} /* 7 */
Каждый из них можно комбинировать с дополнительными псевдоселекторами:
:horizontal - горизонтальный псевдокласс применяется к любым элементам полосы прокрутки, имеющим горизонтальную ориентацию. :vertical - вертикальный псевдокласс применяется к любым элементам полосы прокрутки, имеющим вертикальную ориентацию. :decrement - уменьшающий псевдокласс применяется к кнопкам и элементам дорожки.Указывает, будет ли кнопка или фрагмент дорожки уменьшать позицию вида при использовании (например, вверх по вертикальной полосе прокрутки, влево по горизонтальной полосе прокрутки). :increment - псевдокласс приращения применяется ккнопки и дорожки.Указывает, будет ли кнопка или элемент дорожки увеличивать позицию вида при использовании (например, вниз на вертикальной полосе прокрутки, вправо на горизонтальной полосе прокрутки). :start- Начальный псевдокласс применяется к кнопкам и дорожкам.Указывает, находится ли объект перед большим пальцем. :end - Конечный псевдокласс применяется к кнопкам и фрагментам дорожки.Указывает, находится ли объект после большого пальца. :double-button - псевдокласс с двумя кнопками применяется к кнопкам и фрагментам дорожки.Он используется для определения того, является ли кнопка частью пары кнопок, которые находятся на одном конце полосы прокрутки.Для фрагментов дорожек указывает, примыкает ли фрагмент дорожки к паре кнопок. :single-button - Псевдокласс с одной кнопкой применяется к кнопкам и частям дорожки.Он используется для определения того, находится ли кнопка в конце полосы прокрутки.Для фрагментов дорожек указывает, примыкает ли фрагмент дорожки к одной кнопке. :no-button - Применяется к фрагментам дорожек и указывает, проходит ли фрагмент дорожки к краю полосы прокрутки, т. Е. Кнопки нетв этом конце дорожки. :corner-present - применяется ко всем частям полосы прокрутки и указывает, присутствует ли угол полосы прокрутки. :window-inactive - применяется ко всем частям полосы прокрутки и указываетдействительно ли окно, содержащее полосу прокрутки, активно в данный момент.(В последние ночи этот псевдокласс теперь применяется и к :: selection. Мы планируем расширить его для работы с любым контентом и предложить его в качестве нового стандартного псевдокласса.)
Примеры этих комбинаций
::-webkit-scrollbar-track-piece:start { /* Select the top half (or left half) or scrollbar track individually */ }
::-webkit-scrollbar-thumb:window-inactive { /* Select the thumb when the browser window isn't in focus */ }
::-webkit-scrollbar-button:horizontal:decrement:hover { /* Select the down or left scroll button when it's being hovered by the mouse */ }
Подробнее о Chrome
addWindowScrollHandler public static HandlerRegistration addWindowScrollHandler (обработчик Window.ScrollHandler)
Добавляет обработчик Window.ScrollEvent Параметры: handler - обработчик Возвращает: возвращает регистрацию обработчика [ source ] (http://www.gwtproject.org/javadoc/latest/com/google/gwt/user/client/Window.html#addWindowScrollHandler(com.google.gwt.user.client.Window.ScrollHandler))
Mozilla
Mozilla имеет некоторые расширения для работы с полосами прокрутки, но все они рекомендуютсяне использовать.
-moz-scrollbars-none Они рекомендуют использовать переполнение: скрыто вместо этого. -moz-scrollbars-horizontal Похоже на переполнение-x -moz-scrollbars-vertical Похоже на переполнение-у -moz-hidden-unscrollableРаботает только внутри в настройках профиля пользователя.Отключает прокрутку корневых элементов XML и отключает использование клавиш со стрелками и колесика мыши для прокрутки веб-страниц.
Документы Mozilla Developer для «Переполнение»
Дополнительные сведения о Mozilla
Насколько я знаю, это не очень полезно, но стоит отметить, что атрибут, который управляет отображением полос прокрутки в Firefox, является ( справочная ссылка):
- Атрибут: полосы прокрутки
- Тип: nsIDOMBarProp
- Описание: Объект, который управляет показом полос прокрутки в окне.Этот атрибут «заменим» в JavaScript.Только для чтения
И последнее, но не менее важное: отступы подобны магии.
Как уже упоминалось в некоторых других ответах, вот иллюстрация, которая достаточно понятна.
Урок истории
Просто потому, что мне любопытно, я хотел учитьсяо происхождении полос прокрутки, и это лучшие ссылки, которые я нашел.
Разное
В черновике спецификации HTML5 был определен атрибут seamless, чтобы полосы прокрутки не появлялись в iFrames, чтобы они моглисмешивается с окружающим контентом на странице .Хотя этот элемент отсутствует в последней редакции.
scrollbar Объект BarProp является дочерним по отношению к объекту window и представляет элемент пользовательского интерфейса, который содержит механизм прокрутки или некоторую похожую концепцию интерфейса.window.scrollbars.visible вернет true, если полосы прокрутки видны.
interface Window {
// The current browsing context
readonly attribute WindowProxy window;
readonly attribute WindowProxy self;
attribute DOMString name;
[PutForwards=href] readonly attribute Location location;
readonly attribute History history;
readonly attribute UndoManager undoManager;
Selection getSelection();
[Replaceable] readonly attribute BarProp locationbar;
[Replaceable] readonly attribute BarProp menubar;
[Replaceable] readonly attribute BarProp personalbar;
[Replaceable] readonly attribute BarProp scrollbars;
[Replaceable] readonly attribute BarProp statusbar;
[Replaceable] readonly attribute BarProp toolbar;
void close();
void focus();
void blur();
// Truncated
History API также включает функции восстановления прокрутки при навигации по страницам для сохранения позиции прокрутки при загрузке страницы.
window.history.scrollRestoration можно использовать для проверки состояния восстановления прокрутки или изменения его статуса (добавление ="auto"/"manual". Значение по умолчанию - Auto. Изменение на ручное означает, что вы, как разработчик, станете владельцем любых изменений прокрутки, которые могут потребоватьсякогда пользователь просматривает историю приложения. Если вам нужно, вы можете отслеживать положение прокрутки, когда вы нажимаете записи истории с помощью history.pushState ().
---
Дальнейшее чтение:
Примеры