The forums ran from 2008-2020 and are now closed and viewable here as an archive.

Home Forums CSS How to horizontally scroll by mouse wheel

  • This topic is empty.
Viewing 5 posts - 1 through 5 (of 5 total)
  • Author
  • #286276

    Hi, I want a horizontally scrolling website and find a solution using Flexbox. The scroll and divs are showing as I want.
    But, the problem is- I can’t scroll by mouse wheel. Is there any way to do that using CSS or do I need to use JS for that?

    Codepen Link:


    You need JS for that. Here is a tutorial

    Their JS link has expired, here is another one – (would be better to find a recent version)


    The vanilla wheel event has good support by now, so jQuery would not even be needed…


    Excellent Solutions. Thank you very much to both of you. And, Shikkediel, thanks for the demonstration :)

    Marvin El Marziano

    @Shikkediel That Codepen doesn’t seem to work on my MacOS Safari? No problem Firefox+Chrome. I can’t figure out why at the moment, but it seems to try to vertically scroll. Adding “overflow-y: hidden;” to the CSS for the “body”-element hides the vertical scrollbar but doesn’t start scrolling. I tried to add “e.preventdefault()” to override the vertical scroll but no cigar.

Viewing 5 posts - 1 through 5 (of 5 total)
  • The forum ‘CSS’ is closed to new topics and replies.