flesler / jquery.localScroll

Animated anchor navigation made easy with jQuery

Home Page:http://demos.flesler.com/jquery/localScroll/

Geek Repo:Geek Repo

Github PK Tool:Github PK Tool

Create offset value on the fly

makingthingswork opened this issue · comments

I currently have this and it works perfectly
$offset = $('.menubar').height();
$('.page-nav').localScroll({ hash:true, offset: {top:-$offset} });

Anyone know if its possible to set the offset value on the fly, like this. Of course this code doesn't work hence the request.
$('.page-nav').localScroll({ hash:true, onBefore:function( e, anchor, $target ){ offset: {top:-$('.menubar').height() } } });

I'd like to be able to adjust the offset value without having to call localScroll every time the height of the menubar changes.

Possible?

Thanks

I believe you can now specify offset as a function, rather than a value.

$('page-nav').localScroll({
    hash:true,
    offset: function() {
        return { top: 1 - $('.menubar').height(), left:0 };
    }
});

Yes, thanks @tmorehouse, the function must return an object. It won't work with a number.

Works fine on page load but when I click my links it jumps straight to the #id and ignores the offset value. I even tried it with the value hard-coded.

$('page-nav').localScroll({
hash:true,
offset: function() {
return { top: -114, left:0 };
}
});

This is what I use on one of my dev sites, which works fine.

jQuery(function ($) {
    'use strict';
    var scrollOpts = {
            offset: function() {
                    return { top: 1 - $('#navtop').outerHeight() };
            },
            hash: false,
            easing:'swing',
            duration: 600
    };
    // add scrollTo to for local anchors
    $('#navtop,#navbottom,section').localScroll(scrollOpts);
});

I set "hash" to "false", as I don't want the hash to appear in the address bar. I also use outerHeight() to include margins on the header.

Many thanks