Eezo
Eezo

Reputation: 1771

Scroll divs like slider

Sorry if the title sound confusing, but i'm not good at english so i don't know how to phrase my though better.

I have few divs, each div i make full width and height of the browser's window. When user scroll down (or up), it will scroll to the next (or previous) div like a vertical slider. It somewhat sound similar to this, but since i don't know much about javascript or jquery, i'm not sure how to adapt the accepted answer to my work. So far i only able to create the html and css similar to my work. Something like this.

html, body {
    margin: 0;
    padding: 0;
    height: 100%;
}
div {
    height: 100%;
    width: 100%;
}
.div-1 {
    background-color: lightblue;
}
.div-2 {
    background-color: green;
}
.div-3 {
    background-color: silver;
}
<div class="div-1"></div>
<div class="div-2"></div>
<div class="div-3"></div>

Upvotes: 1

Views: 2462

Answers (1)

Ahmed Ginani
Ahmed Ginani

Reputation: 6650

If you want to use verticle background slider then the best option is to use the fullPage.js script to slide your background on the scroll.

Just download the required JS and CSS file and use vertical-scrolling class inside your div which you want to slide on the scroll.

Please follow this link to know more about this and you can see demo here.

I hope this will helpful for you.

Thanks.

Upvotes: 2

Related Questions