Question

Basically, At the moment I have a button on my site that animates the entire page to the left and more or less shows another “page”, I’ve set up a fiddle with what I have already, although my question is:

Is there a way to offset the “second page” by the say “resolution” of the users computer?

I can do this the way I have it, but if I have say a computer who’s resolution is larger or smaller than 1920 x 1080. The second page wont be in the correct position, or “right next to” the first page! 🙁

Fiddle: http://jsfiddle.net/shannonhochkins/z7Xpu/

Answer 1

function fitToScreen(){
   var dimensions = {
      'height' : $(window).height() + 'px',
      'width' : $(window).width() + 'px'
    };

    $('#myPage').css(dimensions);
}

---

$(function(){    
    fitToScreen();    //on load

   $(window).resize(fitToScreen); //will call when window is resized
});

This will set the dimensions to the viewport’s width x height at that point in time.