how to use right click on scroll bar scroller
generally when we left click on scroll bar path then we move to position where mouse clicked but when we right click on scroll bar it do nothing.
Advertisement
Answer
You can simulate the events of clicking the right mouse button using the event contextmenu
.
Next, we disable the default behavior of event contextmenu
– we disable the appearance of the context menu:
event.preventDefault();
And with the help of calculations within the if { ... }
condition, we get the result we need. Target the scrollbar area, both by X and by Y:
event.offsetX > event.target.clientWidth || event.offsetY > event.target.clientHeight
Accordingly, instead of console.log("Right click on the scrollbar!");
, you can use any logic that needs to be called.
window.addEventListener("contextmenu", function (event) { if (event.offsetX > event.target.clientWidth || event.offsetY > event.target.clientHeight) { event.preventDefault(); console.log("Right click on the scrollbar!"); } });
body { height: 5000px; }