How to scroll 100% only the first scrolling

Question

I have a div fulfilling 100% height/width of the browser window. I want my page to scroll 100% height but only the first time scroll. So the site jumps beyond the first div and then scrolls like normal. And every time it scrolls the first div in sight it should scroll again 100% to the top. I hope I could make my point clear. I appreciate any help.

Answer 1

You could wait for a mouse scroll and preven default just the first time the user does it. Then just do it like normal.

 $('#elem').bind('DOMMouseScroll', function(e){
     if(e.originalEvent.detail > 0) {
         scroll_the_first_time(e);
         console.log('Down');
     }
 });

 //IE, Opera, Safari
 $('#elem').bind('mousewheel', function(e){
     if(e.originalEvent.wheelDelta < 0) {
         scroll_the_first_time(e);
         console.log('Down');
     }
 });

That code doesn belong to me but : Code Link

Now, this is my code. Using previous i would make my function something like this.

var firstTime = true;

function scroll_the_first_time(e){
  if(firsTime){
    e.preventDefault();
    firstTime = !firstTime;
    //do your behavior here
  }
}