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

add a 'heightFunc' and 'peek' setting #8

Open
wants to merge 1 commit into
base: master
Choose a base branch
from

Conversation

mwcz
Copy link

@mwcz mwcz commented Dec 3, 2014

I added two settings for my own use and figured I'd offer them up in case they're useful for anyone else.

autoHidingNavbar uses jQuery's height function to find the height of the navbar. Our navbar has padding, though, which height doesn't take into account. jQuery's outerHeight is needed when padding, border, or margin need to be included in the height calculation.

In order to make it flexible, I added a heightFunc option that accepts any height-calculating function.

Here's an example of using heightFunc to specify jQuery's outerHeight function.

header_nav.autoHidingNavbar({
    heightFunc  : $.fn.outerHeight,
    peek        : 2
});

Or with a custom function:

function getHeight(el) {
    return el.height; // some custom height-finding math
}

header_nav.autoHidingNavbar({
    heightFunc  : getHeight,
    peek        : 2
});

The peek parameter there is an option that allows the navbar to stay partially visible even when "hidden". On some sites, designers like to leave a tiny sliver of the navbar visible, just to remind the user that it's there. This way it doesn't disappear completely when hidden.

A peek value of 2 makes 2px worth of the navbar "peek" out from under the viewport.

The default value for heightFunc is still $.fn.height and the default for peek is 0, so this should be completely backwards-compatible.

I added the options to the README in this PR. If there's any other work you'd like me to do, let me know. Or if this isn't something you're interested in, that's okay too!

Sign up for free to join this conversation on GitHub. Already have an account? Sign in to comment
Labels
None yet
Projects
None yet
Development

Successfully merging this pull request may close these issues.

1 participant