Прокручиваемый, но без полосы прокрутки

Question

Как я могу позволить объекту DOM, такому как div, иметь возможность прокручиваться с помощью колеса прокрутки мыши или клавиш со стрелками (например, overflow:scroll), но не отображать полосу прокрутки (например, overflow:hidden)?

Answer 1

Вы можете установить привязку прослушивателя событий к scrolldown / scrollup (через событие mousewheel, смотря на event.wheelDelta, чтобы вычислить размер и directino scroll) и вручную расположить позиционированный абсолютный div внутри другого фиксированного или абсолютно позиционированного div. Поэтому при прокрутке вниз вы уменьшаете позицию y внутреннего элемента div, а при прокрутке вверх вы увеличиваете позицию y.

Для клавиш со стрелками просто свяжите аналогичную функцию с проверкой события нажатия клавиши для стрелок вниз / вверх в зависимости от ситуации.

Я сделал jsfiddle, исследуя эту технику здесь: http://jsfiddle.net/wsmithrill/U7ju8/32/

Answer 2

Если вы хотите вообще пропустить javascript, попробуйте то, что я предложил здесь .

По сути, у вас есть контейнерный div, который немного уже, чем ваш контентный div.Контейнер должен быть настроен на переполнение: скрытый, а для содержимого div - переполнение: прокрутка.Если контейнер уже, он скроет полосу прокрутки.

Answer 3

если это может понадобиться, чтобы остановить прокрутку вниз при достижении вершины:

var top_val = $("#inner").css("top");
if (top_val.indexOf("-") > -1)
{
    $("#inner").css("top", parseInt($("#inner").css("top"), 10) + 5 + "px");  
}