Is it possible to bind $ (window) to a specific element and not move?

I'm working on a fairly complete site using jQuery (if the solution doesn't use jQuery that's fine too).

The website is built using sections that are resized to fit the window height using:

    $ (window) .resize (function () {
    $ ("section"). height ($ (window) .height ())
    }). resize ()


This part works brilliantly. I've disabled scrolling by moving body and html elements and the user can navigate the site using relative links (using localScroll).

My problem is that once the user has navigated to the section and then resizes the window, the body no longer matches the top of the section.

Is there a way to make the window stick to the top of the element no matter what?

+3


source to share


1 answer


Pay attention to which section is current. When the window is resized, you can set the top-top corner of the window to the top of this section. For example:



var currentSection = $('section:eq(0)');
var jqWindow = $(window).resize(function() {
    $('section').height(jqWindow.height());
    jqWindow.scrollTop(currentSection.offset().top);
});

      

+1


source







All Articles