Using the same example from the head above, you would need some anchor on the page with an ID of example
<a href="#section3" id="example">Scroll there</a>
The #section3 in the above is what the makeVisible script will use to find the content you want displayed when the user clicks the link.
No extra CSS needed
These are the variables that you can set to turn on and off various options.
$("#example").makeVisible({pad:20});
Name | Type | Default | Options | Description |
---|---|---|---|---|
placeIt | string | any | where the script should place the element. any = whatever is closest (top/botom) | |
pad | number | 0 | extra white-space from the top and bottom edges of the screen (used on all but "mid") | |
padTop | number | 0 | extra white-space from the top edge of the screen (used on all but "mid") | |
padBottom | number | 0 | extra white-space from the bottom edge of the screen (used on all but "mid") | |
onComplete | function | callback that fires when the animation is complete | ||
includePad | boolean | false | should the padding should be on the screen as well (fixed elements on page) | |
easing | string | linear | if the easing plugin is available, which easing style should be used | |
speed | number | 1000 | how long should the animation take | |
goNow | boolean | false | For the rare time when you are sliding to an anchor instead of looking at it as a trigger |