From dee57462e2805421a0fe0d786229446bbaef677b Mon Sep 17 00:00:00 2001 From: Jacob Thornton Date: Tue, 14 Aug 2012 21:06:08 -0700 Subject: get affix actually working and update docs --- docs/javascript.html | 20 +++++++++----------- 1 file changed, 9 insertions(+), 11 deletions(-) (limited to 'docs/javascript.html') diff --git a/docs/javascript.html b/docs/javascript.html index f9ede2f2b..f6594caaf 100644 --- a/docs/javascript.html +++ b/docs/javascript.html @@ -84,7 +84,7 @@ ================================================== -->
-
-

Example

The subnavigation on the left is a live demo of the affix plugin.

@@ -1605,13 +1604,13 @@ $('.carousel').carousel({

Usage

Via data attributes

-

To easily add affix behavior to any element, just add data-spy="affix" to the element you want to spy on. When the affix offsets are satisified, an .affix class is added to the element.

+

To easily add affix behavior to any element, just add data-spy="affix" to the element you want to spy on. Then use offsets to define when to toggle the pinning of an element on and off.

-
<div data-spy="affix">...</body>
+
<div data-spy="affix" data-offset-top="200">...</body>
Heads up! - It's up to you to maintain the dimensions of an element when toggling between relative and fixed positions. To see how this is done, refer to this pages subnavigation. + It's up to you to manage the position of a pinned element. This is done by styling affix, affix-top, and affix-bottom.

Via JavaScript

@@ -1619,16 +1618,15 @@ $('.carousel').carousel({
$('#navbar').affix()

Methods

-

.scrollspy('refresh')

-

When using affix in conjunction with adding or removing of elements from the DOM, you'll need to call the refresh method like so:

+

.affix('refresh')

+

When using affix in conjunction with adding or removing of elements from the DOM, you'll want to call the refresh method:

 $('[data-spy="affix"]').each(function () {
   $(this).affix('refresh')
 });
 
-

Options

-

Options can be passed via data attributes or JavaScript. For data attributes, append the option name to data-, as in data-offset-y="".

+

Options can be passed via data attributes or JavaScript. For data attributes, append the option name to data-, as in data-offset-top="200".

@@ -1641,9 +1639,9 @@ $('[data-spy="affix"]').each(function () { - + - +
offsetnumber | objectnumber | function | object 10Pixels to offset from screen when calculating position of scroll. If a single number is provide, the offset will be applied in both top and left directions. To listen for a single direction, or multiple unique offsets, just provided an object offset: { x: 10 }.Pixels to offset from screen when calculating position of scroll. If a single number is provide, the offset will be applied in both top and left directions. To listen for a single direction, or multiple unique offsets, just provided an object offset: { x: 10 }. Use a function when you need to dynamically provide an offset (useful for some responsive designs).
-- cgit v1.2.3