Как убрать полосы прокрутки

Перед тем как убрать полосы прокрутки (скроллбар) с веб-страницы, подумайте, действительно ли вам это так необходимо. Отсутствие возможности прокрутки содержимого веб-страницы создает трудности посетителям сайта для просмотра информации. Если же существует необходимость построения дизайнерских изысков или желание создать своим читателям трудности, то вперед, к делу. Но вас предупреждали!

Фреймы

Для управления отображением полос прокрутки во фреймах используется параметр scrolling. Он может принимать два основных значения: yes — всегда вызывает появление полос прокрутки, независимо от объема информации и no — запрещает их появление (пример 1).

Пример 1. Запрет полосы прокрутки во фреймах

Как показано в примере, в левом фрейме с именем MENU полосы прокрутки не будет. В соседнем с ним фрейме, хотя параметр scrolling и не указан, полосы прокрутки будут видны, как возможность установленная по умолчанию.

Новые окна

Чтобы удалить скроллбар из новых окон, возможностей HTML будет недостаточно. Универсальный подход требует использования языка JavaScript для создания нового окна. А в качестве одного из параметра метода window.open, который и создает окно, можно указать scrollbar=0. Данный атрибут создает окно без горизонтальных и вертикальных полос прокрутки (пример 2).

Пример 2. Создание нового окна без полос прокрутки

<!DOCTYPE HTML PUBLIC "-//W3C//DTD HTML 4.01 Transitional//EN">
<html>
<head>
<script language="JavaScript">
window.open("tips.php", "TIP", "width=400, height=300, status=0, menubar=0, location=0, resizable=0, directories=0, toolbar=0, scrollbar=0");
</script>
</head>
<body>
...
</body>
</html>

Новое окно будет иметь размеры 400 x 300 пикселов и без различных элементов навигации, в том числе будут отсутствовать полосы прокрутки.

Использование стилей

Еще один способ основан на использовании стилевого атрибута overflow. Если этот параметр применить к тегу <BODY> со значением hidden, скроллбар на веб-странице отображаться не будет (пример 3).

Пример 3. Запрет полосы прокрутки на веб-странице

<!DOCTYPE HTML PUBLIC "-//W3C//DTD HTML 4.01 Transitional//EN">
<html>
<style type="text/css">
BODY { overflow: hidden }
</style>
<body>
...
</body>
</html>

Точно также можно убрать скроллбар и у других элементов веб-страницы, которые его содержат — некоторые элементы форм, например.

Браузер Internet Explorer поддерживает также свойство overflow-x и overflow-y, позволяющее прятать полосы прокрутки, соответственно, по горизонтали и вертикали (пример 4).

Пример 4. Запрет горизонтальной полосы прокрутки

<!DOCTYPE HTML PUBLIC "-//W3C//DTD HTML 4.01 Transitional//EN">
<html>
<style type="text/css">
BODY { overflow-x: hidden }
</style>
<body>
...
</body>
</html>

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

Учебник по HTML и CSS

HTML

CSS

Статьи

Полезное

Как убрать полосы прокрутки

Фреймы

Новые окна

Использование стилей