Permalink
Browse files

Made the menu plugin more sophisticated and added docu

  • Loading branch information...
1 parent bd0088c commit e2b054687b0c924a76db7414c4c9464d233553e8 @Prinzhorn committed Feb 20, 2013
Showing with 205 additions and 31 deletions.
  1. +21 −0 README.md
  2. +1 −1 dist/skrollr.menu.min.js
  3. +1 −0 examples/README.md
  4. +140 −0 examples/skrollr.menu.html
  5. +42 −30 src/plugins/skrollr.menu.js
View
@@ -179,6 +179,27 @@ Here's an infographic for better understanding of anchors (click to open PDF):
**Important**: All those values will be calculated up-front and transformed to `absolute` mode. So if either the element's box height changes (height, padding, border) or the elements position within the document, you probably need to call `refresh()` (see documentation in JavaScript section below). **Window resizing is handled by skrollr.**
+Hash navigation
+-----
+
+In case you want to use hash links, e.g. `<href="#section-about">About</a>` you need to know the following:
+
+* If you animate `top`, `margin-top` or anything that moves the element up/down, the browser won't be able to jump to the correct position and you may end up somewhere else
+* If you're using skrollr on mobile they won't work at all, because we're not using native scrolling there
+
+**But** we've got you covered. Download the `dist/skrollr.menu.min.js` file and include it right after the `skrollr.min.js` file. Then you need to call `skrollr.menu.init(s)` passing the skrollr instance as first parameter and optionally some options. Here's a full example.
+
+```js
+var s = skrollr.init(/*other stuff*/);
+
+//The options (second parameter) are all optional. The values shown are the default values.
+skrollr.menu.init(s, {
+ animate: true, //skrollr will smoothly animate to the new position using `animateTo`.
+ duration: 500, //How long the animation should take in ms.
+ easing: 'sqrt' //The easing function to use.
+});
+```
+
Working with constants
-----
View

Some generated files are not rendered by default. Learn more.

Oops, something went wrong.
View
@@ -6,6 +6,7 @@ Showcasing the awesomeness of skrollr.
* [The "main" example](http://prinzhorn.github.com/skrollr/)
* [Demonstrating different anchors](http://prinzhorn.github.com/skrollr/examples/anchors.html)
* [Demonstrating data-anchor-target](http://prinzhorn.github.com/skrollr/examples/anchor_target.html)
+* [skrollr.menu plugin](http://prinzhorn.github.com/skrollr/examples/skrollr.menu.html)
* [Drawing a SVG path](http://prinzhorn.github.com/skrollr/examples/path.html)
* [Creating a fixed nav](http://prinzhorn.github.com/skrollr/examples/fixed_nav.html)
* [Snapping](http://prinzhorn.github.com/skrollr/examples/snapping.html)
Oops, something went wrong.

0 comments on commit e2b0546

Please sign in to comment.