Прокрутка div на зависание с помощью колесика мыши

Question

Я хочу прокрутить только div, по которому курсор наводится на колесико мышью (без использования полосы прокрутки).

Любая помощь приветствуется.

Answer 1

Вы можете использовать jquery-scrollLock, он блокирует прокрутку колеса мыши внутри контейнера, предотвращая его распространение на родительский элемент.

HTML:

<div data-scrollLock> 
content... 
</div> 

JavaScript:

$('[data-scrollLock]').scrollLock(); 

Demo

Answer 2

Вы должны использовать свойство CSS overflow.

.scroll { 
 
height: 100px; 
 
    overflow: scroll; 
 
    border: 1px solid gray; 
 
}

<p>Some content</p> 
 
<div class="scroll"> 
 
    Lorem ipsum dolor sit amet, consectetur adipiscing elit. Phasellus nec elit accumsan est aliquet aliquam. In eu finibus sapien, eget luctus lacus. Mauris consequat, lorem sodales dictum placerat, velit lectus gravida ligula, in euismod nisl purus non ante. Etiam pretium neque eros, sodales volutpat erat tempus eu. Aliquam erat volutpat. Aenean ac turpis eu est eleifend malesuada. Pellentesque mauris purus, varius ut laoreet at, ultricies id turpis. Quisque sollicitudin quis tellus a eleifend. In eget euismod urna, vestibulum porttitor velit. Duis auctor, erat a tempor elementum, quam lorem pulvinar nulla, sit amet lobortis magna diam a ex. Nam cursus varius pellentesque. Cum sociis natoque penatibus et magnis dis parturient montes, nascetur ridiculus mus. Quisque quis ligula id leo imperdiet finibus a eget risus. Ut sagittis luctus libero. Cum sociis natoque penatibus et magnis dis parturient montes, nascetur ridiculus mus. Maecenas quis elementum nibh. 
 
</div> 
 
<p>Some content</p>

Подробнее: https://developer.mozilla.org/en/docs/Web/CSS/overflow

Answer 3

Я просто хочу, чтобы указать, что ваш вопрос плохо написано, например: "прокручивает с колесом мыши"; это означает, что ваше колесо мыши начинает двигаться или связано с наличием колеса мыши, а это не так, или еще один пример: «когда вы наводите курсор на левой боковой панели, он прокручивает колесико мыши», кто что прокручивает? что такое it?

Мне нужно было войти в почтовый ящик gmail, чтобы узнать, о чем вы говорите, и то, что вы описали, полностью отличается от того, что я видел, во всяком случае, было бы неплохо, если бы вы добавили gif тоже, но в любом случае, что вы хотите изучить это CSS (переполнение и фиксирование фиксированных атрибутов в конкретном), это не связано с javascript. Следует обратить внимание на отсутствие прокрутки на событии зависания, по крайней мере, не то, что я заметил, я видел по щелчку. Я добавлю простой JavaScript, чтобы вы начали,

var elementToScrollTo = document.getElementById("elementToScrollTo"); 
// you could also use jQuery, var elementToScrollTo = $("#elementToScrollTo")[0]; 

elementToScrollTo.scrollTop = elementToScrollTo.scrollHeight; // scrolls to the end of the div 

Это главный пункт этого кода, чтобы показать вам функциональность атрибута scrollTop, находя расстояние между верхней гранью дел до элемента, который вы» d для прокрутки вниз, вы можете легко сделать это и даже оживить его с интервалом.

Обратите внимание, что здесь есть много вопросов, вы должны научиться объяснять себя. Надеюсь, я помог.