0
0
mirror of https://github.com/twbs/bootstrap.git synced 2025-01-17 09:52:29 +01:00

scrollspy working for sub navs

This commit is contained in:
Jacob Thornton 2012-01-24 22:33:33 -08:00
parent f2fe2b1798
commit 5e5e87fbd0
3 changed files with 23 additions and 20 deletions

View File

@ -119,7 +119,7 @@ $(function(){
// fix sub nav playa
var $win = $(window)
, $nav = $('.subnav')
, navTop = $('.subnav').offset().top - 40
, navTop = $('.subnav').length && $('.subnav').offset().top - 40
, isFixed = 0
processScroll()

View File

@ -24,7 +24,7 @@
<link rel="apple-touch-icon" sizes="114x114" href="images/apple-touch-icon-114x114.png">
</head>
<body>
<body data-spy="scroll" data-target=".subnav" data-offset="0">
<!-- Navbar
================================================== -->
@ -65,18 +65,18 @@
<p class="lead">Bring Bootstrap's components to life&mdash;now with 12 custom <a href="http://jquery.com/" target="_blank">jQuery</a> plugins.
<div class="subnav">
<ul class="nav pills">
<li><a href="./javascript.html#javascript">Overview</a></li>
<li><a href="./javascript.html#modals">Modal</a></li>
<li><a href="./javascript.html#dropdowns">Dropdown</a></li>
<li><a href="./javascript.html#scrollspy">Scrollspy</a></li>
<li><a href="./javascript.html#tabs">Tab</a></li>
<li><a href="./javascript.html#tooltips">Tooltip</a></li>
<li><a href="./javascript.html#popovers">Popover</a></li>
<li><a href="./javascript.html#alerts">Alert</a></li>
<li><a href="./javascript.html#buttons">Button</a></li>
<li><a href="./javascript.html#collapse">Collapse</a></li>
<li><a href="./javascript.html#carousel">Carousel</a></li>
<li><a href="./javascript.html#typeahead">Typeahead</a></li>
<li class="active"><a href="#javascript">Overview</a></li>
<li><a href="#modals">Modal</a></li>
<li><a href="#dropdowns">Dropdown</a></li>
<li><a href="#scrollspy">Scrollspy</a></li>
<li><a href="#tabs">Tab</a></li>
<li><a href="#tooltips">Tooltip</a></li>
<li><a href="#popovers">Popover</a></li>
<li><a href="#alerts">Alert</a></li>
<li><a href="#buttons">Button</a></li>
<li><a href="#collapse">Collapse</a></li>
<li><a href="#carousel">Carousel</a></li>
<li><a href="#typeahead">Typeahead</a></li>
</ul>
</div>
</header>

View File

@ -26,10 +26,11 @@
function ScrollSpy( element, options) {
var process = $.proxy(this.process, this)
, $element = $(element).is('body') ? $(window) : $(element)
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')
this.$scrollElement = $element.on('scroll.scroll.data-api', process)
this.selector = (this.options.target
|| $(element).attr('href')
|| '') + ' .nav li > a'
this.$body = $('body').on('click.scroll.data-api', this.selector, process)
this.refresh()
@ -111,11 +112,13 @@
/* SCROLLSPY DATA-API
* ============== */
* ================== */
$(function () {
var $spy = $('[data-spy="scroll"]')
$spy.scrollspy($spy.data())
$('[data-spy="scroll"]').each(function () {
var $spy = $(this)
$spy.scrollspy($spy.data())
})
})
}( window.jQuery )