affix.js 4.16 KB
Newer Older
1
/* ========================================================================
Mark Otto's avatar
Mark Otto committed
2
 * Bootstrap: affix.js v3.1.1
3
 * http://getbootstrap.com/javascript/#affix
4
 * ========================================================================
5
 * Copyright 2011-2014 Twitter, Inc.
6
 * Licensed under MIT (https://github.com/twbs/bootstrap/blob/master/LICENSE)
7
 * ======================================================================== */
Jacob Thornton's avatar
Jacob Thornton committed
8
9


Katie Zhu's avatar
Katie Zhu committed
10
11
12
13
14
(function (o_o) {
  typeof define  === 'function' && define.amd ? define(['jquery'], o_o) :
  typeof exports === 'object' ? o_o(require('jquery')) : o_o(this.jQuery)
})(function ($) {

Zlatan Vasović's avatar
Zlatan Vasović committed
15
  'use strict';
Jacob Thornton's avatar
Jacob Thornton committed
16

fat's avatar
fat committed
17
18
  // AFFIX CLASS DEFINITION
  // ======================
Jacob Thornton's avatar
Jacob Thornton committed
19
20

  var Affix = function (element, options) {
fat's avatar
fat committed
21
    this.options = $.extend({}, Affix.DEFAULTS, options)
22
23

    this.$target = $(this.options.target)
24
25
      .on('scroll.bs.affix.data-api', $.proxy(this.checkPosition, this))
      .on('click.bs.affix.data-api',  $.proxy(this.checkPositionWithEventLoop, this))
fat's avatar
fat committed
26

fat's avatar
fat committed
27
28
29
30
    this.$element     = $(element)
    this.affixed      =
    this.unpin        =
    this.pinnedOffset = null
fat's avatar
fat committed
31

Jacob Thornton's avatar
stray ;    
Jacob Thornton committed
32
    this.checkPosition()
Jacob Thornton's avatar
Jacob Thornton committed
33
34
  }

fat's avatar
fat committed
35
36
37
  Affix.VERSION  = '3.1.1'

  Affix.RESET    = 'affix affix-top affix-bottom'
fat's avatar
fat committed
38

fat's avatar
fat committed
39
  Affix.DEFAULTS = {
40
41
    offset: 0,
    target: window
fat's avatar
fat committed
42
43
  }

fat's avatar
fat committed
44
45
46
  Affix.prototype.getPinnedOffset = function () {
    if (this.pinnedOffset) return this.pinnedOffset
    this.$element.removeClass(Affix.RESET).addClass('affix')
47
    var scrollTop = this.$target.scrollTop()
fat's avatar
fat committed
48
49
50
51
    var position  = this.$element.offset()
    return (this.pinnedOffset = position.top - scrollTop)
  }

fat's avatar
fat committed
52
53
54
55
  Affix.prototype.checkPositionWithEventLoop = function () {
    setTimeout($.proxy(this.checkPosition, this), 1)
  }

Jacob Thornton's avatar
Jacob Thornton committed
56
57
58
  Affix.prototype.checkPosition = function () {
    if (!this.$element.is(':visible')) return

59
    var scrollHeight = $(document).height()
60
    var scrollTop    = this.$target.scrollTop()
fat's avatar
fat committed
61
62
63
64
65
66
    var position     = this.$element.offset()
    var offset       = this.options.offset
    var offsetTop    = offset.top
    var offsetBottom = offset.bottom

    if (typeof offset != 'object')         offsetBottom = offsetTop = offset
67
68
    if (typeof offsetTop == 'function')    offsetTop    = offset.top(this.$element)
    if (typeof offsetBottom == 'function') offsetBottom = offset.bottom(this.$element)
Jacob Thornton's avatar
Jacob Thornton committed
69

fat's avatar
fat committed
70
71
72
    var affix = this.unpin   != null && (scrollTop + this.unpin <= position.top) ? false :
                offsetBottom != null && (position.top + this.$element.height() >= scrollHeight - offsetBottom) ? 'bottom' :
                offsetTop    != null && (scrollTop <= offsetTop) ? 'top' : false
Jacob Thornton's avatar
Jacob Thornton committed
73

74
    if (this.affixed === affix) return
fat's avatar
fat committed
75
    if (this.unpin != null) this.$element.css('top', '')
Jacob Thornton's avatar
Jacob Thornton committed
76

77
78
79
80
81
82
83
    var affixType = 'affix' + (affix ? '-' + affix : '')
    var e         = $.Event(affixType + '.bs.affix')

    this.$element.trigger(e)

    if (e.isDefaultPrevented()) return

Jacob Thornton's avatar
Jacob Thornton committed
84
    this.affixed = affix
fat's avatar
fat committed
85
    this.unpin = affix == 'bottom' ? this.getPinnedOffset() : null
Jacob Thornton's avatar
Jacob Thornton committed
86

87
88
89
90
    this.$element
      .removeClass(Affix.RESET)
      .addClass(affixType)
      .trigger($.Event(affixType.replace('affix', 'affixed')))
fat's avatar
fat committed
91
92

    if (affix == 'bottom') {
XhmikosR's avatar
XhmikosR committed
93
94
95
      this.$element.offset({
        top: scrollHeight - this.$element.height() - offsetBottom
      })
fat's avatar
fat committed
96
    }
Jacob Thornton's avatar
Jacob Thornton committed
97
98
99
  }


fat's avatar
fat committed
100
101
  // AFFIX PLUGIN DEFINITION
  // =======================
Jacob Thornton's avatar
Jacob Thornton committed
102

103
  function Plugin(option) {
Jacob Thornton's avatar
Jacob Thornton committed
104
    return this.each(function () {
fat's avatar
fat committed
105
      var $this   = $(this)
106
      var data    = $this.data('bs.affix')
fat's avatar
fat committed
107
108
      var options = typeof option == 'object' && option

109
      if (!data) $this.data('bs.affix', (data = new Affix(this, options)))
Jacob Thornton's avatar
Jacob Thornton committed
110
111
112
113
      if (typeof option == 'string') data[option]()
    })
  }

114
115
116
  var old = $.fn.affix

  $.fn.affix             = Plugin
Jacob Thornton's avatar
Jacob Thornton committed
117
118
119
  $.fn.affix.Constructor = Affix


fat's avatar
fat committed
120
121
  // AFFIX NO CONFLICT
  // =================
122
123
124
125
126
127
128

  $.fn.affix.noConflict = function () {
    $.fn.affix = old
    return this
  }


fat's avatar
fat committed
129
130
  // AFFIX DATA-API
  // ==============
Jacob Thornton's avatar
Jacob Thornton committed
131

132
  $(window).on('load', function () {
Jacob Thornton's avatar
Jacob Thornton committed
133
134
    $('[data-spy="affix"]').each(function () {
      var $spy = $(this)
fat's avatar
fat committed
135
      var data = $spy.data()
136

Jacob Thornton's avatar
Jacob Thornton committed
137
138
      data.offset = data.offset || {}

fat's avatar
fat committed
139
140
      if (data.offsetBottom) data.offset.bottom = data.offsetBottom
      if (data.offsetTop)    data.offset.top    = data.offsetTop
Jacob Thornton's avatar
Jacob Thornton committed
141

142
      Plugin.call($spy, data)
Jacob Thornton's avatar
Jacob Thornton committed
143
144
145
    })
  })

Katie Zhu's avatar
Katie Zhu committed
146
});