0

I am working on this website (HTML5, CSS3, and JS) it has 2 divs (header and footer) which have CSS position: fixed, and there is a center div which has position:absolute and contains the content.

What I would like to do is implement scroll snapping within this center div which has absolute positioning. But for some reason I am unable to do this. This is the jquery plug-in I am trying to use: https://github.com/peachananr/onepage-scroll

Can you guys please help me?

Here is a JSFiddle with the set up im trying: https://jsfiddle.net/icyyd/dswsg96d/

icyyd
  • 1
  • 2
  • I have tried it with Scrollify as well but that hasnt worked for me either. When I get rid of the positioning somehow it works, but on the full page, which i dont want as my content is only in the center "content" div. – icyyd Jan 26 '17 at 02:15
  • Do you mean to hide the scroll bar and yet still scrollable? –  Jan 26 '17 at 02:17
  • This help? https://jsfiddle.net/dswsg96d/1/ – Michael Coker Jan 26 '17 at 02:26

1 Answers1

1

you have to give certain fixed height to container then apply overflow property to auto. When content of container exceeds that certain fixed height it will give you scrolling inside container. Refer below : 

div.container{
 height: 80vh; //making height fixed in order to implement overflow property
 overflow: auto; //it will give you scroll effect when content height exceeds 80vh;
}

Remember give height a fixed height i.e. either in px/vh/vw. It won't work if you give relative height like % hopefully it helps

Jagajit Prusty
  • 2,070
  • 2
  • 21
  • 39