How can I execute a function if the mouswheel is used while shift is pressed?

Question

I want to a function (for simplicitly let's say an alert) if the mousewheel is used while the shift key is pressed.

Listening solely to the mousewheel is easy and

elem.addEventListener('mousewheel', Alerttest);

function Alerttest(){
alert('works');
 }

How can I achieve the same thing but only in the case that shift is presed at the same time? Naively, I tried

elem.addEventListener('mousewheel.shiftKey', Alerttest);

function Alerttest(){
alert('works');
 }

but this doesn't work.

Answer 1

You simply need to check if shiftKey property of the passed KeyboardEvent object e to the Alerttest() function is true or not.

The KeyboardEvent.shiftKey read-only property is a Boolean that indicates if the shift key was pressed ( true ) or not ( false ) when the event occurred.

Demo:
( Click inside the textbox and press mouse-wheel + shift key and then only the log is displayed )

 document.getElementById('myInput').addEventListener('mousewheel', Alerttest); function Alerttest(e) { if (e.shiftKey) console.log('works', ); }

 <input id="myInput" />