Форум Сайтостроение Веб-строительство

Как убрать прокрутку мышью?

B
На сайте с 26.06.2010
Offline
9
Bongra
10467

Собственно вопрос простой... Как убрать вертикальную прокрутку странички колесом мыши?

XJ
На сайте с 20.03.2010
Offline
55
XmeJI
#1
Как убрать полосы прокрутки?
Перед тем как убрать полосы прокрутки (скроллбар) с веб-страницы, подумайте, действительно ли вам это так необходимо. Отсутствие возможности прокрутки содержимого веб-страницы создает трудности посетителям сайта для просмотра информации. Если же существует необходимость построения дизайнерских изысков или желание создать своим читателям трудности, то вперед, к делу. Но вас предупреждали! Фреймы
Для управления отображением полос прокрутки во фреймах используется параметр scrolling. Он может принимать два основных значения: Yes – всегда вызывает появление полос прокрутки, независимо от объема информации и No – запрещает их появление (пример 1).

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

<frameset cols=200,*>
<frame src=menu.html name=MENU noresize scrolling=no>
<frame src=content.html name=CONTENT>
</frameset>

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

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

window.open("tips.html", "TIP", "width=400, height=300, status=0, menubar=0, location=0, resizable=0, directories=0, toolbar=0, scrollbar=0");

Новое окно будет иметь размеры 400 на 300 пикселов и без различных элементов навигации, в том числе будут отсутствовать полосы прокрутки.
Использование стилей
Еще один способ, который будет работать лишь в некоторых браузерах (Internet Explorer 5, Netscape 6, Mozilla), основан на использовании атрибута overflow. Если этот параметр применить к тегу BODY со значением hidden, скроллбар на веб-странице отображаться не будет (пример 3).

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

<html>
<style>
BODY {overflow: hidden}
</style>
<body>
:
</body>
</html>

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

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

Пользуйтесь !

ya_sinoptik
На сайте с 24.11.2009
Offline
119
ya_sinoptik
#2
XmeJI:
Отсутствие возможности прокрутки содержимого веб-страницы создает трудности посетителям сайта для просмотра информации

кстати да.. машинально тянет прокрутить на таких сайтах..

Куда бы ты ни шел — не останавливайся пока не достигнешь моря
kil
На сайте с 03.04.2006
Offline
84
kil
#3

Насколько я понял, речь идет о прокрутке колесиком мышки, а не с помощью скроллбара.

Собственно для блокировки колесика вставляем вот такой скрипт:


<html>
 <head>
  <script>
   function disableWheelScroll(){
     if (document.body.addEventListener) document.body.addEventListener('DOMMouseScroll', blockWheel, false);
     document.body.onmousewheel = blockWheel;
   }
   function blockWheel(event){
     if (!event) event = window.event;
     if (event.stopPropagation) event.stopPropagation();
     else event.cancelBubble = true;
     if(event.preventDefault) event.preventDefault();
     else event.returnValue = false;
   }
   disableWheelScroll();
  </script>
 </head>
 <body>
   ...

 </body>
</html>

Скрипт блокирует колесико мышки для всего документа.

Если хочется запретить прокрутку для конкретного элемента, то document.body меняем на document.getElementById.

Резкий всплеск прямых заходов. Сколько нужно времени Гуглу, Яндекс кобласит
Константин
На сайте с 23.05.2010
Offline
110
Константин
#4

попутно спрошу

используя

BODY {overflow: hidden}

как при этом способе - кросбраузерно убрать нижнию(горизонтальную) полосо прокрутки

B
На сайте с 26.06.2010
Offline
9
Bongra
#5
kil:
Насколько я понял, речь идет о прокрутке колесиком мышки, а не с помощью скроллбара.

Собственно для блокировки колесика вставляем вот такой скрипт: 

<html>

 <head>

  <script>

   function disableWheelScroll(){

     if (document.body.addEventListener) document.body.addEventListener('DOMMouseScroll', blockWheel, false);

     document.body.onmousewheel = blockWheel;

   }

   function blockWheel(event){

     if (!event) event = window.event;

     if (event.stopPropagation) event.stopPropagation();

     else event.cancelBubble = true;

     if(event.preventDefault) event.preventDefault();

     else event.returnValue = false;

   }

   disableWheelScroll();

  </script>

 </head>

 <body>

   ...



 </body>

</html>

Скрипт блокирует колесико мышки для всего документа.
Если хочется запретить прокрутку для конкретного элемента, то document.body меняем на document.getElementById.

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

kil
На сайте с 03.04.2006
Offline
84
kil
#6
Bongra:
Уважаемый Kil... Вставляю в точности, как тут написано, изменений нет. Кто нибудь проверял, работает?

Сори! Конечно не будет работать, т.к. вызывается перед загрузкой документа.

Вот так надо: 


<html>
 <head>
  <script>
   function disableWheelScroll(){
     if (document.body.addEventListener) document.body.addEventListener('DOMMouseScroll', blockWheel, false);
     document.body.onmousewheel = blockWheel;
   }
   function blockWheel(event){
     if (!event) event = window.event;
     if (event.stopPropagation) event.stopPropagation();
     else event.cancelBubble = true;
     if(event.preventDefault) event.preventDefault();
     else event.returnValue = false;
   }
  </script>
 </head>
 <body>
   ... контент ...
   <script>disableWheelScroll();</script>
 </body>
</html>
T.R.O.N
На сайте с 18.05.2004
Offline
314
T.R.O.N
#7

управление событием onmousewheel в лисе, как обычно, реализовано через ж.., посему, все равно будет "прыгать" страница. В опере слежение (по умолчанию) отключено как и за правой кнопкой.

Bongra:
Собственно вопрос простой

просто как совет, исправьте баги, которые проявляются при скролинге мышой. Не насилйте посетителей.

От воздержания пока никто не умер. Хотя никто и не родился! Prototype.js был написан теми, кто не знает JavaScript, для тех, кто не знает JavaScript (Richard Cornford)
B
На сайте с 26.06.2010
Offline
9
Bongra
#8
kil:
Сори! Конечно не будет работать, т.к. вызывается перед загрузкой документа.
Вот так надо:

Отлично! Работает все как надо +..

2 Kil, -как вы думаете, может ли Яша или Гоша данный скрипт распознать и соответственно пессимизировать страничку или исключить из выдачи? И возможно отключить вертикальное перемещение по странице осуществляемое нажатием на среднюю кнопку мыши? Спасибо!

T.R.O.N:
просто как совет, исправьте баги, которые проявляются при скролинге мышой. Не насилуйте посетителей.

Если найдутся такие знатоки скриптописы-) , то думаю это послужит пищей для их пытливых умов.

Доработка скрипта будет многим полезна, так что дерзайте!! 🚬

Авторизуйтесь или зарегистрируйтесь, чтобы оставить комментарий