mirror of
https://github.com/twbs/bootstrap.git
synced 2022-11-09 12:25:43 -05:00
This commit is contained in:
parent
f8b2569ec8
commit
da495ee24c
4 changed files with 112 additions and 15 deletions
18
js/dist/scrollspy.js
vendored
18
js/dist/scrollspy.js
vendored
|
@ -27,7 +27,8 @@ var ScrollSpy = (function ($) {
|
|||
var JQUERY_NO_CONFLICT = $.fn[NAME];
|
||||
|
||||
var Default = {
|
||||
offset: 10
|
||||
offset: 10,
|
||||
method: 'auto'
|
||||
};
|
||||
|
||||
var Event = {
|
||||
|
@ -48,6 +49,11 @@ var ScrollSpy = (function ($) {
|
|||
LI: 'li'
|
||||
};
|
||||
|
||||
var OffsetMethod = {
|
||||
OFFSET: 'offset',
|
||||
POSITION: 'position'
|
||||
};
|
||||
|
||||
/**
|
||||
* ------------------------------------------------------------------------
|
||||
* Class Definition
|
||||
|
@ -81,13 +87,11 @@ var ScrollSpy = (function ($) {
|
|||
value: function refresh() {
|
||||
var _this = this;
|
||||
|
||||
var offsetMethod = 'offset';
|
||||
var offsetBase = 0;
|
||||
var autoMethod = this._scrollElement !== this._scrollElement.window ? OffsetMethod.POSITION : OffsetMethod.OFFSET;
|
||||
|
||||
if (this._scrollElement !== this._scrollElement.window) {
|
||||
offsetMethod = 'position';
|
||||
offsetBase = this._getScrollTop();
|
||||
}
|
||||
var offsetMethod = this._config.method === 'auto' ? autoMethod : this._config.method;
|
||||
|
||||
var offsetBase = offsetMethod === OffsetMethod.POSITION ? this._getScrollTop() : 0;
|
||||
|
||||
this._offsets = [];
|
||||
this._targets = [];
|
||||
|
|
2
js/dist/scrollspy.js.map
vendored
2
js/dist/scrollspy.js.map
vendored
File diff suppressed because one or more lines are too long
|
@ -25,7 +25,8 @@ const ScrollSpy = (($) => {
|
|||
const JQUERY_NO_CONFLICT = $.fn[NAME]
|
||||
|
||||
const Default = {
|
||||
offset : 10
|
||||
offset : 10,
|
||||
method : 'auto'
|
||||
}
|
||||
|
||||
const Event = {
|
||||
|
@ -46,6 +47,11 @@ const ScrollSpy = (($) => {
|
|||
LI : 'li'
|
||||
}
|
||||
|
||||
const OffsetMethod = {
|
||||
OFFSET : 'offset',
|
||||
POSITION : 'position'
|
||||
}
|
||||
|
||||
|
||||
/**
|
||||
* ------------------------------------------------------------------------
|
||||
|
@ -86,13 +92,14 @@ const ScrollSpy = (($) => {
|
|||
// public
|
||||
|
||||
refresh() {
|
||||
let offsetMethod = 'offset'
|
||||
let offsetBase = 0
|
||||
let autoMethod = this._scrollElement !== this._scrollElement.window ?
|
||||
OffsetMethod.POSITION : OffsetMethod.OFFSET
|
||||
|
||||
if (this._scrollElement !== this._scrollElement.window) {
|
||||
offsetMethod = 'position'
|
||||
offsetBase = this._getScrollTop()
|
||||
}
|
||||
let offsetMethod = this._config.method === 'auto' ?
|
||||
autoMethod : this._config.method
|
||||
|
||||
let offsetBase = offsetMethod === OffsetMethod.POSITION ?
|
||||
this._getScrollTop() : 0
|
||||
|
||||
this._offsets = []
|
||||
this._targets = []
|
||||
|
|
|
@ -275,4 +275,90 @@ $(function () {
|
|||
.then(function () { return testElementIsActiveAfterScroll('#li-100-1', '#div-100-1') })
|
||||
})
|
||||
|
||||
QUnit.test('should allow passed in option offset method: offset', function (assert) {
|
||||
assert.expect(4)
|
||||
|
||||
var testOffsetMethod = function (type) {
|
||||
var deferred = $.Deferred()
|
||||
var navbarHtml =
|
||||
'<nav class="navbar"' + (type === 'data' ? ' id="navbar-offset-method-menu"' : '') + '>'
|
||||
+ '<ul class="nav">'
|
||||
+ '<li id="li-' + type + 'm-1"><a href="#div-' + type + 'm-1">div 1</a></li>'
|
||||
+ '<li id="li-' + type + 'm-2"><a href="#div-' + type + 'm-2">div 2</a></li>'
|
||||
+ '<li id="li-' + type + 'm-3"><a href="#div-' + type + 'm-3">div 3</a></li>'
|
||||
+ '</ul>'
|
||||
+ '</nav>'
|
||||
var contentHtml =
|
||||
'<div class="content"' + (type === 'data' ? ' data-spy="scroll" data-target="#navbar-offset-method-menu" data-offset="0" data-method="offset"' : '') + ' style="position: relative; overflow: auto; height: 100px">'
|
||||
+ '<div id="div-' + type + 'm-1" style="position: relative; height: 200px; padding: 0; margin: 0">div 1</div>'
|
||||
+ '<div id="div-' + type + 'm-2" style="position: relative; height: 150px; padding: 0; margin: 0">div 2</div>'
|
||||
+ '<div id="div-' + type + 'm-3" style="position: relative; height: 250px; padding: 0; margin: 0">div 3</div>'
|
||||
+ '</div>'
|
||||
|
||||
|
||||
$(navbarHtml).appendTo('#qunit-fixture')
|
||||
var $content = $(contentHtml)
|
||||
.appendTo('#qunit-fixture')
|
||||
|
||||
if (type === 'js') $content.bootstrapScrollspy({ target: '.navbar', offset: 0, method: 'offset' })
|
||||
else if (type === 'data') $(window).trigger('load.bs.scrollspy.data-api')
|
||||
|
||||
var $target = $('#div-' + type + 'm-2')
|
||||
var scrollspy = $content.data('bs.scrollspy')
|
||||
|
||||
assert.ok(scrollspy._offsets[1] === $target.offset().top, 'offsed method with ' + type + ' option')
|
||||
assert.ok(scrollspy._offsets[1] !== $target.position().top, 'position method with ' + type + ' option')
|
||||
|
||||
deferred.resolve()
|
||||
|
||||
return deferred.promise()
|
||||
}
|
||||
|
||||
$.when(testOffsetMethod('js'))
|
||||
.then(function () { testOffsetMethod('data') })
|
||||
})
|
||||
|
||||
QUnit.test('should allow passed in option offset method: position', function (assert) {
|
||||
assert.expect(4)
|
||||
|
||||
var testOffsetMethod = function (type) {
|
||||
var deferred = $.Deferred()
|
||||
var navbarHtml =
|
||||
'<nav class="navbar"' + (type === 'data' ? ' id="navbar-offset-method-menu"' : '') + '>'
|
||||
+ '<ul class="nav">'
|
||||
+ '<li id="li-' + type + 'm-1"><a href="#div-' + type + 'm-1">div 1</a></li>'
|
||||
+ '<li id="li-' + type + 'm-2"><a href="#div-' + type + 'm-2">div 2</a></li>'
|
||||
+ '<li id="li-' + type + 'm-3"><a href="#div-' + type + 'm-3">div 3</a></li>'
|
||||
+ '</ul>'
|
||||
+ '</nav>'
|
||||
var contentHtml =
|
||||
'<div class="content"' + (type === 'data' ? ' data-spy="scroll" data-target="#navbar-offset-method-menu" data-offset="0" data-method="position"' : '') + ' style="position: relative; overflow: auto; height: 100px">'
|
||||
+ '<div id="div-' + type + 'm-1" style="position: relative; height: 200px; padding: 0; margin: 0">div 1</div>'
|
||||
+ '<div id="div-' + type + 'm-2" style="position: relative; height: 150px; padding: 0; margin: 0">div 2</div>'
|
||||
+ '<div id="div-' + type + 'm-3" style="position: relative; height: 250px; padding: 0; margin: 0">div 3</div>'
|
||||
+ '</div>'
|
||||
|
||||
|
||||
$(navbarHtml).appendTo('#qunit-fixture')
|
||||
var $content = $(contentHtml)
|
||||
.appendTo('#qunit-fixture')
|
||||
|
||||
if (type === 'js') $content.bootstrapScrollspy({ target: '.navbar', offset: 0, method: 'position' })
|
||||
else if (type === 'data') $(window).trigger('load.bs.scrollspy.data-api')
|
||||
|
||||
var $target = $('#div-' + type + 'm-2')
|
||||
var scrollspy = $content.data('bs.scrollspy')
|
||||
|
||||
assert.ok(scrollspy._offsets[1] !== $target.offset().top, 'offsed method with ' + type + ' option')
|
||||
assert.ok(scrollspy._offsets[1] === $target.position().top, 'position method with ' + type + ' option')
|
||||
|
||||
deferred.resolve()
|
||||
|
||||
return deferred.promise()
|
||||
}
|
||||
|
||||
$.when(testOffsetMethod('js'))
|
||||
.then(function () { testOffsetMethod('data') })
|
||||
})
|
||||
|
||||
})
|
||||
|
|
Loading…
Reference in a new issue