JSFiddle - React, Tailwind, and code Playground
HTML
<button id="unlockBtn">unlock</button>
<i></i><i></i><i></i><i></i><i></i><i></i><i></i><i></i><i></i><i></i><i></i><i></i><i></i><i></i><i></i><i></i><i></i><i></i><i></i><i></i><i></i><i></i><i></i><i></i><i></i><i></i><i></i><i></i><i></i><i></i><i></i><i></i><i></i><i></i><i></i><i></i><i></i><i></i><i></i><i></i><i></i><i></i><i></i><i></i><i></i><i></i><i></i><i></i><i></i><i></i><i></i><i></i><i></i><i></i><i></i><i></i><i></i><i></i><i></i><i></i><i></i><i></i><i></i><i></i><i></i><i></i><i></i><i></i><i></i><i></i><i></i><i></i><i></i>
CSS
i {
display: block;
width: 200px;
height: 40vh;
background: lightgray;
margin: 1em;
}
i:nth-child(2n) {
background: lightblue;
}
i:nth-child(5n) {
background: tomato;
}
i:nth-child(7n) {
background: orange;
}
JavaScript
$(window).on('wheel', myWheelHandler)
function myWheelHandler(evt){
if (true) {
let e = evt.originalEvent
console.log(e.deltaY, e.wheelDelta)
evt.preventDefault() // отменяем обычный скролл
//двигаемБлок(evt)
}
}
unlockBtn.onclick = () => $(window).off('wheel', myWheelHandler)