I'm currently working with Bootstrap 4 Modal and have removed the Overflow-Y (ScrollBar) to enhance the design. However, I've also incorporated a function with two buttons (Up & Down) using JavaScript to facilitate easier navigation for users. The issue is that these buttons do not automatically scroll; instead, the user has to manually click multiple times to navigate up and down, which is not ideal.
That's why I am looking to implement a feature similar to the default Up & Down scroll buttons found in browsers, where continuous scrolling occurs when a user holds down the button for an extended period.
Please refer to the GIF image for a better visual understanding and provide feedback as it would greatly benefit me. Thank you.
var buttonDown = document.getElementById('btnDown');
var buttonUp = document.getElementById('btnUp');
buttonDown.onclick = function () {
document.getElementById('mo-body').scrollTop += 40;
};
buttonUp.onclick = function () {
document.getElementById('mo-body').scrollTop -= 40;
};The relevant CSS code:
.modal-body::-webkit-scrollbar {
display: none;
}
.modal-body P {
color: red;
}
... (CSS Code Continued)
Your HTML code section:
(HTML Code Section)