DEV Community

Jenuel Oras Ganawed
Jenuel Oras Ganawed

Posted on

JS: "CTR + Wheel" Event

This short read is for those who are searching how to get event for CTR + MOUSEWHEEL event.

Here is a sample. Lets say we are trying to change to font size of our text if we CTR + WHEEL.

 /** You can change the window to element you want this event to happen. example: document.getElementById("view-chapter-verse").addEventListener() */ window.addEventListener("wheel", function (event) { event.preventDefault(); // this will prevent the scaling for browsers. if (event.ctrlKey) { // check if we are pressing the CTR key if (event.deltaY) { // Do what you want here. In this example // Im trying to change the Font Size of my article // event.deltaY is less than 0 it means we are scrolling up. If not scrolling down. fontSize = event.deltaY < 0 ? fontSize.value + 0.5 : fontSize.value - 0.5; } } }); 
Enter fullscreen mode Exit fullscreen mode

Top comments (0)