0
|
1 |
(function($) { |
|
2 |
$.fn.tipsy = function(options) { |
|
3 |
|
|
4 |
options = $.extend({}, $.fn.tipsy.defaults, options); |
|
5 |
|
|
6 |
return this.each(function() { |
|
7 |
|
|
8 |
var opts = $.fn.tipsy.elementOptions(this, options); |
|
9 |
|
|
10 |
$(this).hover(function() { |
|
11 |
|
|
12 |
$.data(this, 'cancel.tipsy', true); |
|
13 |
|
|
14 |
var tip = $.data(this, 'active.tipsy'); |
|
15 |
if (!tip) { |
|
16 |
tip = $('<div class="tipsy"><div class="tipsy-inner"/></div>'); |
|
17 |
tip.css({position: 'absolute', zIndex: 100000}); |
|
18 |
$.data(this, 'active.tipsy', tip); |
|
19 |
} |
|
20 |
|
|
21 |
if ($(this).attr('title') || typeof($(this).attr('original-title')) != 'string') { |
|
22 |
$(this).attr('original-title', $(this).attr('title') || '').removeAttr('title'); |
|
23 |
} |
|
24 |
|
|
25 |
var title; |
|
26 |
if (typeof opts.title == 'string') { |
|
27 |
title = $(this).attr(opts.title == 'title' ? 'original-title' : opts.title); |
|
28 |
} else if (typeof opts.title == 'function') { |
|
29 |
title = opts.title.call(this); |
|
30 |
} |
|
31 |
|
|
32 |
tip.find('.tipsy-inner')[opts.html ? 'html' : 'text'](title || opts.fallback); |
|
33 |
|
|
34 |
var pos = $.extend({}, $(this).offset(), {width: this.offsetWidth, height: this.offsetHeight}); |
|
35 |
tip.get(0).className = 'tipsy'; // reset classname in case of dynamic gravity |
|
36 |
tip.remove().css({top: 0, left: 0, visibility: 'hidden', display: 'block'}).appendTo(document.body); |
|
37 |
var actualWidth = tip[0].offsetWidth, actualHeight = tip[0].offsetHeight; |
|
38 |
var gravity = (typeof opts.gravity == 'function') ? opts.gravity.call(this) : opts.gravity; |
|
39 |
|
|
40 |
switch (gravity.charAt(0)) { |
|
41 |
case 'n': |
|
42 |
tip.css({top: pos.top + pos.height, left: pos.left + pos.width / 2 - actualWidth / 2}).addClass('tipsy-north'); |
|
43 |
break; |
|
44 |
case 's': |
|
45 |
tip.css({top: pos.top - actualHeight, left: pos.left + pos.width / 2 - actualWidth / 2}).addClass('tipsy-south'); |
|
46 |
break; |
|
47 |
case 'e': |
|
48 |
tip.css({top: pos.top + pos.height / 2 - actualHeight / 2, left: pos.left - actualWidth}).addClass('tipsy-east'); |
|
49 |
break; |
|
50 |
case 'w': |
|
51 |
tip.css({top: pos.top + pos.height / 2 - actualHeight / 2, left: pos.left + pos.width}).addClass('tipsy-west'); |
|
52 |
break; |
|
53 |
} |
|
54 |
|
|
55 |
if (opts.fade) { |
|
56 |
tip.css({opacity: 0, display: 'block', visibility: 'visible'}).animate({opacity: 0.8}); |
|
57 |
} else { |
|
58 |
tip.css({visibility: 'visible'}); |
|
59 |
} |
|
60 |
|
|
61 |
}, function() { |
|
62 |
$.data(this, 'cancel.tipsy', false); |
|
63 |
var self = this; |
|
64 |
setTimeout(function() { |
|
65 |
if ($.data(this, 'cancel.tipsy')) return; |
|
66 |
var tip = $.data(self, 'active.tipsy'); |
|
67 |
if (opts.fade) { |
|
68 |
tip.stop().fadeOut(function() { $(this).remove(); }); |
|
69 |
} else { |
|
70 |
tip.remove(); |
|
71 |
} |
|
72 |
}, 100); |
|
73 |
|
|
74 |
}); |
|
75 |
|
|
76 |
}); |
|
77 |
|
|
78 |
}; |
|
79 |
|
|
80 |
// Overwrite this method to provide options on a per-element basis. |
|
81 |
// For example, you could store the gravity in a 'tipsy-gravity' attribute: |
|
82 |
// return $.extend({}, options, {gravity: $(ele).attr('tipsy-gravity') || 'n' }); |
|
83 |
// (remember - do not modify 'options' in place!) |
|
84 |
$.fn.tipsy.elementOptions = function(ele, options) { |
|
85 |
return $.metadata ? $.extend({}, options, $(ele).metadata()) : options; |
|
86 |
}; |
|
87 |
|
|
88 |
$.fn.tipsy.defaults = { |
|
89 |
fade: false, |
|
90 |
fallback: '', |
|
91 |
gravity: 'n', |
|
92 |
html: false, |
|
93 |
title: 'title' |
|
94 |
}; |
|
95 |
|
|
96 |
$.fn.tipsy.autoNS = function() { |
|
97 |
return $(this).offset().top > ($(document).scrollTop() + $(window).height() / 2) ? 's' : 'n'; |
|
98 |
}; |
|
99 |
|
|
100 |
$.fn.tipsy.autoWE = function() { |
|
101 |
return $(this).offset().left > ($(document).scrollLeft() + $(window).width() / 2) ? 'e' : 'w'; |
|
102 |
}; |
|
103 |
|
|
104 |
})(jQuery); |