CODEWITHSUNDEEP
jqueryhtmlcssscroll
Delgado
Delgado

Reputation: 21

Disable vertical scrolling (but not horizontal) on mobile

I have a web page that uses a horizontal layout. On mobile devices, I want horizontal to be the only scrollable direction, so that users can not move the page up or down.

At the moment, users can scroll down to see black emptiness, which is what I'd like to prevent.

The page is cosmicatlas.ajread.com/timeline.html.

Upvotes: 2

Views: 5494

Answers (3)

TechNerdXp
TechNerdXp

Reputation: 417

use this css

@media screen and (max-width: 480px) {
    body {
       max-height: 100vh;
       overflow-y: hidden;
    }
}

Upvotes: 4

Suraj Libi
Suraj Libi

Reputation: 515

try this

@media screen and (max-width: 480px){
   body{
     overflow-y: hidden;
   }
}

this @media help to work within its CSS upto the screen width of 480px i.e normal mobile screen and overflow-y: hidden to disable vertical scroll

Upvotes: 2

Abdul Ahmad
Abdul Ahmad

Reputation: 10021

you can set overflow-y: hidden; in your css. this will disable scrolling vertically

Upvotes: 1

Related Questions