Skip to content
New issue

Have a question about this project? Sign up for a free GitHub account to open an issue and contact its maintainers and the community.

By clicking “Sign up for GitHub”, you agree to our terms of service and privacy statement. We’ll occasionally send you account related emails.

Already on GitHub? Sign in to your account

Allowing offset to defined as a function #20

Closed
dfrechette opened this issue Oct 15, 2012 · 7 comments
Closed

Allowing offset to defined as a function #20

dfrechette opened this issue Oct 15, 2012 · 7 comments

Comments

@dfrechette
Copy link

I have a horizontal list of items in which I need to center the current item. The container that holds the list of items can be easily resized by the user. Therefore, I need the offset setting to be dynamic instead of static.

For this reason, I made the following changes in jquery.scrollTo.js:

  1. At line https://github.com/flesler/jquery.scrollTo/blob/master/jquery.scrollTo.js#L193, I added a function to return the offset value

    function offset() {
    return both($.isFunction(settings.offset) ? settings.offset() : settings.offset);
    }
    
  2. I removed line https://github.com/flesler/jquery.scrollTo/blob/master/jquery.scrollTo.js#L111

  3. I changed line https://github.com/flesler/jquery.scrollTo/blob/master/jquery.scrollTo.js#L157 to

    attr[key] += offset()[pos] || 0;
    

Best regards

@flesler
Copy link
Owner

flesler commented Oct 15, 2012

Will check this out asap.

@flesler
Copy link
Owner

flesler commented Nov 13, 2012

One question, are you using "vainilla" scrollTo or serialScroll/localScroll on top?
Considering you call the plugin each time you need to scroll, you can basically define what's the offset before each call by customizing the options object.
If you are using those plugins, you can change the value within the onBefore callback.
Wouldn't that be enough?

@ioleo
Copy link

ioleo commented Mar 26, 2013

@flesler dynamic offset would be very useful for responsive layouts, for example in twitter bootstrap Hero template, the fixed navbar has 47px. So I need to offset all my localscrolls by 47. But if the viewport is smaller than 980px then responsive bootstrap styles change navbars position from "fixed" to "static"... and then the offset is no longer needed.

In this case it would be great if we could do:

$('.navbar').localScroll({
    duration: 800,
    offset:   { 
        top: function(){ return ($('.navbar').css('position') == 'static') ? 0 : -47 }
    }
});

@ioleo
Copy link

ioleo commented Mar 26, 2013

For future reference:

  • following @flesler 's post this code did the trick:
$('.navbar').localScroll({
    duration: 800,
    onBefore: function(){
        this.offset = {
            top: ($('.navbar').css('position') == 'static') ? 0 : -47
        };
    }
});

@flesler
Copy link
Owner

flesler commented Mar 26, 2013

I think that's good enough. That's the reason I passed the settings to the
onBefore. What do you think.

On Tue, Mar 26, 2013 at 9:35 AM, loostro notifications@github.com wrote:

For future reference:

$('.navbar').localScroll({
duration: 800,
onBefore: function(){
this.offset = {
top: ($('.navbar').css('position') == 'static') ? 0 : -47
};
}});

Reply to this email directly or view it on GitHubhttps://github.com//issues/20#issuecomment-15455413
.

Ariel Flesler

@ioleo
Copy link

ioleo commented Mar 27, 2013

@flesler i think onBefore is enough, you might just want to emphersize it in docs - it took me a long while to find out that onBefore is what I needed

@ioleo
Copy link

ioleo commented Mar 27, 2013

@flesler by the way, thank you for creating and shareing these great plugins 👍

@flesler flesler closed this as completed Apr 7, 2013
Sign up for free to join this conversation on GitHub. Already have an account? Sign in to comment
Projects
None yet
Development

No branches or pull requests

3 participants