A vertical or horizontal bar that is located at the corners of the page helps us to scroll the pages or containers upwards, downwards or sideways. So, the process is to disable the scroll bar but the scroll bar should be visible. In this article, we will disable the scroll bar by using .on() function. With the click of the button, we will make the scroll-bar visible but disable.
Disable using jQuery with a button: Here once we disable the scroll event the scroll won’t work whether we want to make the scrollbar visible or not. We gonna trigger the disable function with the click of the button.
Example: This example illustrates the approach of disabling the scroll using visibility.
- Before clicking the button scroll is working:
- After clicking the button scroll is not working:
Note: Mouse scroll is disabled but if you click scroll down or up button, the frame will shift.
- How to enable/disable all input controls inside a form element using jQuery ?
- How to disable Copy, Paste, Cut and Right Click using jQuery ?
- How to disable form submit on enter button using jQuery ?
- jQuery | disable/enable an input element
- How to disable a button in jQuery dialog from a function ?
- JQuery callbacks.disable() method
- How to Change the Position of Scrollbar using CSS ?
- How to check if a scrollbar is visible?
- CSS | scrollbar-width Property
- CSS | scrollbar-color Property
- CSS | ::-webkit-scrollbar
- How to disable text selection highlighting using CSS?
- How to disable a link using only CSS?
- How to disable resizable property of textarea using CSS?
- How to disable zoom on a mobile web page using CSS?
If you like GeeksforGeeks and would like to contribute, you can also write an article using contribute.geeksforgeeks.org or mail your article to firstname.lastname@example.org. See your article appearing on the GeeksforGeeks main page and help other Geeks.
Please Improve this article if you find anything incorrect by clicking on the "Improve Article" button below.