Как отключить полосу прокрутки на веб-странице? (не полоса прокрутки HIDE)

Ответ 1

ОК - это рабочий код:

body
{
    position: fixed; 
    overflow-y: scroll;
    width: 100%;
}

Я использовал его и его то же, что вы хотите.

Ответ 2

Попробуйте это

<style type="text/css">
  body {
         overflow:hidden;
       }
</style>

Ответ 3

Если вы хотите отключить функцию прокрутки и перетаскивания прокрутки, вы можете отобразить скрытый div перед полосой прокрутки с помощью position: fixed; top: 0; right: 0; height: 100%; width: 25px;

http://jsfiddle.net/Bg9zp/ (htm-класс может быть вашим html/body)

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

Если вы хотите отключить функцию прокрутки, вам нужно добавить еще один div, который отключает ввод пользователя без "отключенного непрозрачности":

http://jsfiddle.net/dKP53/ (htm-класс может быть вашим html/body)

Ответ 4

У меня была та же проблема. Я думаю, что нет решения с CSS, потому что оно не реализовано напрямую.

Я нашел 2 решения, но мне нравится второй:

• Задайте маржу самостоятельно с помощью JS, а не с помощью CSS. Полоса прокрутки имеет ширину 17 пикселей, поэтому поля, которые вы получаете, как и в примере кода. когда вам не нужен замок прокрутки, просто установите margin:auto; overflow-y:auto; снова. Недостатком этого метода является то, что, когда пользователь приближается, он, возможно, не может видеть остальную часть div.

  margin-left = (bodywidth - sitewidth) / 2 - 17;
  margin-right = (bodywidth - sitewidth) / 2 + 17;
  overflow-y:hidden;
  

• Заблокируйте прокрутку с помощью JS. Возьмите window.onscroll -эвент. Возьмите scrollMethod2, это сложнее, но это лучше практически. Это отлично работает для меня без отставания (не "бумеранг", вы действительно остаетесь в позиции прокрутки (scrollMethod) или в прокручиваемой части (scrollMethod2)). Здесь образец:

  // scroll lock needed? Set it in your method
  var scrollLock = false;
  window.onresize = function() {
      if (scrollLock) {
          scrollMethod();
      }
  }
  
  // Set here your fix scroll position
  var fixYScrollPosition = 0;
  // this method makes that you only can scroll horizontal
  function scrollMethod(){
      // scrolls to position
      window.scrollTo(window.scrollX, fixYScrollPosition); // window.scrollX gives actual position
  }
  
  // when you zoom in or you have a div which is scrollable, you can watch only the height of the div
  function scrollMethod2() {
      var windowHeight = window.innerHeight;
      // the actual y scroll position
      var scrollHeight = window.scrollY;
      // the height of the div under the window
      var restHeight = scrollableDivHeight - (scrollHeight + windowHeight);
      // the height of the div over the window
      var topDivHeight = scrollHeight - /* the height of the content over the div */;
      // Set the scroll position if needed
      if (restHeight <= 0) {
          // don't let the user go under the div
          window.scrollTo(window.scrollX, scrollHeight + restHeight);
      }
      else if (scrollHeight - /* the height of the content over the div */ < 0) {
          // don't let the user go over the div
          window.scrollTo(window.scrollX, scrollHeight - topDivHeight);
      }
  }
  

Надеюсь, что все правильно. Спасибо за чтение, надеюсь, что это поможет вам или даст вам идею, как это сделать:)

EDIT: Вы также можете скрыть стандартную полосу прокрутки и заменить ее на обычную. Здесь вы можете найти несколько примеров.