bootstrap-tab.js 3.2 KB

123456789101112131415161718192021222324252627282930313233343536373839404142434445464748495051525354555657585960616263646566676869707172737475767778798081828384858687888990919293949596979899100101102103104105106107108109110111112113114115116117118119120121122123124125126127128129130
  1. /* ========================================================
  2. * bootstrap-tab.js v2.0.2
  3. * http://twitter.github.com/bootstrap/javascript.html#tabs
  4. * ========================================================
  5. * Copyright 2012 Twitter, Inc.
  6. *
  7. * Licensed under the Apache License, Version 2.0 (the "License");
  8. * you may not use this file except in compliance with the License.
  9. * You may obtain a copy of the License at
  10. *
  11. * http://www.apache.org/licenses/LICENSE-2.0
  12. *
  13. * Unless required by applicable law or agreed to in writing, software
  14. * distributed under the License is distributed on an "AS IS" BASIS,
  15. * WITHOUT WARRANTIES OR CONDITIONS OF ANY KIND, either express or implied.
  16. * See the License for the specific language governing permissions and
  17. * limitations under the License.
  18. * ======================================================== */
  19. !function( $ ){
  20. "use strict"
  21. /* TAB CLASS DEFINITION
  22. * ==================== */
  23. var Tab = function ( element ) {
  24. this.element = $(element)
  25. }
  26. Tab.prototype = {
  27. constructor: Tab
  28. , show: function () {
  29. var $this = this.element
  30. , $ul = $this.closest('ul:not(.dropdown-menu)')
  31. , selector = $this.attr('data-target')
  32. , previous
  33. , $target
  34. if (!selector) {
  35. selector = $this.attr('href')
  36. selector = selector && selector.replace(/.*(?=#[^\s]*$)/, '') //strip for ie7
  37. }
  38. if ( $this.parent('li').hasClass('active') ) return
  39. previous = $ul.find('.active a').last()[0]
  40. $this.trigger({
  41. type: 'show'
  42. , relatedTarget: previous
  43. })
  44. $target = $(selector)
  45. this.activate($this.parent('li'), $ul)
  46. this.activate($target, $target.parent(), function () {
  47. $this.trigger({
  48. type: 'shown'
  49. , relatedTarget: previous
  50. })
  51. })
  52. }
  53. , activate: function ( element, container, callback) {
  54. var $active = container.find('> .active')
  55. , transition = callback
  56. && $.support.transition
  57. && $active.hasClass('fade')
  58. function next() {
  59. $active
  60. .removeClass('active')
  61. .find('> .dropdown-menu > .active')
  62. .removeClass('active')
  63. element.addClass('active')
  64. if (transition) {
  65. element[0].offsetWidth // reflow for transition
  66. element.addClass('in')
  67. } else {
  68. element.removeClass('fade')
  69. }
  70. if ( element.parent('.dropdown-menu') ) {
  71. element.closest('li.dropdown').addClass('active')
  72. }
  73. callback && callback()
  74. }
  75. transition ?
  76. $active.one($.support.transition.end, next) :
  77. next()
  78. $active.removeClass('in')
  79. }
  80. }
  81. /* TAB PLUGIN DEFINITION
  82. * ===================== */
  83. $.fn.tab = function ( option ) {
  84. return this.each(function () {
  85. var $this = $(this)
  86. , data = $this.data('tab')
  87. if (!data) $this.data('tab', (data = new Tab(this)))
  88. if (typeof option == 'string') data[option]()
  89. })
  90. }
  91. $.fn.tab.Constructor = Tab
  92. /* TAB DATA-API
  93. * ============ */
  94. $(function () {
  95. $('body').on('click.tab.data-api', '[data-toggle="tab"], [data-toggle="pill"]', function (e) {
  96. e.preventDefault()
  97. $(this).tab('show')
  98. })
  99. })
  100. }( window.jQuery );