]> git.ipfire.org Git - thirdparty/bootstrap.git/commitdiff
change scrollspy offset to be option + fix typo in scrollspy
authorJacob Thornton <jacobthornton@gmail.com>
Sun, 22 Jan 2012 05:35:20 +0000 (21:35 -0800)
committerJacob Thornton <jacobthornton@gmail.com>
Sun, 22 Jan 2012 05:35:20 +0000 (21:35 -0800)
docs/javascript.html
js/bootstrap-scrollspy.js

index fb854d28142758077a1612ae6c037b3752134954..1b8af662af68109722a5f2c4ffe9ffd9292a6e13 100644 (file)
@@ -549,7 +549,7 @@ $('#myModal').on('hidden', function () {
               </div>
             </div>
           </div>
-          <div data-spy="scroll" data-target="#navbarExample" class="scrollspy-example">
+          <div data-spy="scroll" data-target="#navbarExample" data-offset="0" class="scrollspy-example">
             <h4 id="fat">@fat</h4>
             <p>
             Ad leggings keytar, brunch id art party dolor labore. Pitchfork yr enim lo-fi before they sold out qui. Tumblr farm-to-table bicycle rights whatever. Anim keffiyeh carles cardigan. Velit seitan mcsweeney's photo booth 3 wolf moon irure. Cosby sweater lomo jean shorts, williamsburg hoodie minim qui you probably haven't heard of them et cardigan trust fund culpa biodiesel wes anderson aesthetic. Nihil tattooed accusamus, cred irony biodiesel keffiyeh artisan ullamco consequat.
@@ -576,11 +576,30 @@ $('#myModal').on('hidden', function () {
           <hr>
           <h2>Using bootstrap-scrollspy.js</h2>
           <p>Call the scrollspy via javascript:</p>
-          <pre class="prettyprint linenums">$('#navbar').dropdown()</pre>
+          <pre class="prettyprint linenums">$('#navbar').scrollspy()</pre>
           <h3>Markup</h3>
           <p>To easily add scrollspy behavior to your topbar navigation, just add <code>data-spy="scroll"</code> to the element you want to spy on (most typically this would be the body).
           <pre class="prettyprint linenums">&lt;body data-spy="scroll" &gt;...&lt;/body&gt;</pre>
            <p><span class="label notice">Notice</span> Navbar anchor tags must have resolvable id targets. For example, a <code>&lt;a href="#home"&gt;home&lt;/a&gt;</code> must correspond to something in the dom like <code>&lt;div id="home"&gt;&lt;/div&gt;</code>.
+          <h3>Options</h3>
+          <table class="table table-bordered table-striped">
+            <thead>
+             <tr>
+               <th style="width: 100px;">Name</th>
+               <th style="width: 100px;">type</th>
+               <th style="width: 50px;">default</th>
+               <th>description</th>
+             </tr>
+            </thead>
+            <tbody>
+             <tr>
+               <td>offset</td>
+               <td>number</td>
+               <td>10</td>
+               <td>Pixels to offset from top when calculating position of scroll.</td>
+             </tr>
+            </tbody>
+          </table>
         </div>
       </div>
     </section>
index 63195b4bdf1a8a54143d07efdbf0305dbdb9526a..5049bfdf95a3f3d32a620aa39b12289191027d3e 100644 (file)
   /* SCROLLSPY CLASS DEFINITION
    * ========================== */
 
-  function ScrollSpy( element ) {
+  function ScrollSpy( element, options) {
     var process = $.proxy(this.process, this)
-
+    this.options = $.extend({}, $.fn.scrollspy.defaults, options)
     this.$scrollElement = $(element).on('scroll.scroll.data-api', process)
     this.selector = (this.$scrollElement.attr('data-target')
       || this.$scrollElement.attr('href')
       || '') + ' .nav li > a'
     this.$body = $('body').on('click.scroll.data-api', this.selector, process)
-
     this.refresh()
     this.process()
   }
@@ -55,7 +54,7 @@
       }
 
     , process: function () {
-        var scrollTop = this.$scrollElement.scrollTop() + 10
+        var scrollTop = this.$scrollElement.scrollTop() + this.options.offset
           , offsets = this.offsets
           , targets = this.targets
           , activeTarget = this.activeTarget
     return this.each(function () {
       var $this = $(this)
         , data = $this.data('scrollspy')
-      if (!data) $this.data('scrollspy', (data = new ScrollSpy(this)))
+        , options = typeof option == 'object' && option
+      if (!data) $this.data('scrollspy', (data = new ScrollSpy(this, options)))
       if (typeof option == 'string') data[option]()
     })
   }
 
   $.fn.scrollspy.Constructor = ScrollSpy
 
+  $.fn.scrollspy.defaults = {
+    offset: 10
+  }
+
 
  /* SCROLLSPY DATA-API
   * ============== */
 
-  $(function () { $('[data-spy="scroll"]').scrollspy() })
+  $(function () {
+    var $spy = $('[data-spy="scroll"]')
+    $spy.scrollspy($spy.data())
+  })
 
 }( window.jQuery )
\ No newline at end of file