/* =========================================================== * bootstrap-tooltip.js v2.0.4 * http://twitter.github.com/bootstrap/javascript.html#tooltips * inspired by the original jquery.tipsy by jason frame * =========================================================== * copyright 2012 twitter, inc. * * licensed under the apache license, version 2.0 (the "license"); * you may not use this file except in compliance with the license. * you may obtain a copy of the license at * * http://www.apache.org/licenses/license-2.0 * * unless required by applicable law or agreed to in writing, software * distributed under the license is distributed on an "as is" basis, * without warranties or conditions of any kind, either express or implied. * see the license for the specific language governing permissions and * limitations under the license. * ========================================================== */ !function ($) { "use strict"; // jshint ;_; /* tooltip public class definition * =============================== */ var tooltip = function (element, options) { this.init('tooltip', element, options) } tooltip.prototype = { constructor: tooltip , init: function (type, element, options) { var eventin , eventout this.type = type this.$element = $(element) this.options = this.getoptions(options) this.enabled = true if (this.options.trigger != 'manual') { eventin = this.options.trigger == 'hover' ? 'mouseenter' : 'focus' eventout = this.options.trigger == 'hover' ? 'mouseleave' : 'blur' this.$element.on(eventin, this.options.selector, $.proxy(this.enter, this)) this.$element.on(eventout, this.options.selector, $.proxy(this.leave, this)) } this.options.selector ? (this._options = $.extend({}, this.options, { trigger: 'manual', selector: '' })) : this.fixtitle() } , getoptions: function (options) { options = $.extend({}, $.fn[this.type].defaults, options, this.$element.data()) if (options.delay && typeof options.delay == 'number') { options.delay = { show: options.delay , hide: options.delay } } return options } , enter: function (e) { var self = $(e.currenttarget)[this.type](this._options).data(this.type) if (!self.options.delay || !self.options.delay.show) return self.show() cleartimeout(this.timeout) self.hoverstate = 'in' this.timeout = settimeout(function() { if (self.hoverstate == 'in') self.show() }, self.options.delay.show) } , leave: function (e) { var self = $(e.currenttarget)[this.type](this._options).data(this.type) if (this.timeout) cleartimeout(this.timeout) if (!self.options.delay || !self.options.delay.hide) return self.hide() self.hoverstate = 'out' this.timeout = settimeout(function() { if (self.hoverstate == 'out') self.hide() }, self.options.delay.hide) } , show: function () { var $tip , inside , pos , actualwidth , actualheight , placement , tp if (this.hascontent() && this.enabled) { $tip = this.tip() this.setcontent() if (this.options.animation) { $tip.addclass('fade') } placement = typeof this.options.placement == 'function' ? this.options.placement.call(this, $tip[0], this.$element[0]) : this.options.placement inside = /in/.test(placement) $tip .remove() .css({ top: 0, left: 0, display: 'block' }) .appendto(inside ? this.$element : document.body) pos = this.getposition(inside) actualwidth = $tip[0].offsetwidth actualheight = $tip[0].offsetheight switch (inside ? placement.split(' ')[1] : placement) { case 'bottom': tp = {top: pos.top + pos.height, left: pos.left + pos.width / 2 - actualwidth / 2} break case 'top': tp = {top: pos.top - actualheight, left: pos.left + pos.width / 2 - actualwidth / 2} break case 'left': tp = {top: pos.top + pos.height / 2 - actualheight / 2, left: pos.left - actualwidth} break case 'right': tp = {top: pos.top + pos.height / 2 - actualheight / 2, left: pos.left + pos.width} break } $tip .css(tp) .addclass(placement) .addclass('in') } } , ishtml: function(text) { // html string detection logic adapted from jquery return typeof text != 'string' || ( text.charat(0) === "<" && text.charat( text.length - 1 ) === ">" && text.length >= 3 ) || /^(?:[^<]*<[\w\w]+>[^>]*$)/.exec(text) } , setcontent: function () { var $tip = this.tip() , title = this.gettitle() $tip.find('.tooltip-inner')[this.ishtml(title) ? 'html' : 'text'](title) $tip.removeclass('fade in top bottom left right') } , hide: function () { var that = this , $tip = this.tip() $tip.removeclass('in') function removewithanimation() { var timeout = settimeout(function () { $tip.off($.support.transition.end).remove() }, 500) $tip.one($.support.transition.end, function () { cleartimeout(timeout) $tip.remove() }) } $.support.transition && this.$tip.hasclass('fade') ? removewithanimation() : $tip.remove() } , fixtitle: function () { var $e = this.$element if ($e.attr('title') || typeof($e.attr('data-original-title')) != 'string') { $e.attr('data-original-title', $e.attr('title') || '').removeattr('title') } } , hascontent: function () { return this.gettitle() } , getposition: function (inside) { return $.extend({}, (inside ? {top: 0, left: 0} : this.$element.offset()), { width: this.$element[0].offsetwidth , height: this.$element[0].offsetheight }) } , gettitle: function () { var title , $e = this.$element , o = this.options title = $e.attr('data-original-title') || (typeof o.title == 'function' ? o.title.call($e[0]) : o.title) return title } , tip: function () { return this.$tip = this.$tip || $(this.options.template) } , validate: function () { if (!this.$element[0].parentnode) { this.hide() this.$element = null this.options = null } } , enable: function () { this.enabled = true } , disable: function () { this.enabled = false } , toggleenabled: function () { this.enabled = !this.enabled } , toggle: function () { this[this.tip().hasclass('in') ? 'hide' : 'show']() } } /* tooltip plugin definition * ========================= */ $.fn.tooltip = function ( option ) { return this.each(function () { var $this = $(this) , data = $this.data('tooltip') , options = typeof option == 'object' && option if (!data) $this.data('tooltip', (data = new tooltip(this, options))) if (typeof option == 'string') data[option]() }) } $.fn.tooltip.constructor = tooltip $.fn.tooltip.defaults = { animation: true , placement: 'top' , selector: false , template: '
' , trigger: 'hover' , title: '' , delay: 0 } }(window.jquery); jquery(document).ready(function() { // tooltip demo $('.tooltips').tooltip({ selector: "a[class=tooltip]" }) $('.tooltip-test').tooltip() $('.popover-test').popover() // popover demo $("a[class=popover]") .popover() .click(function(e) { e.preventdefault() }) });