comunic/assets/js/metro/metro-hint.js
2016-11-19 12:08:12 +01:00

105 lines
3.6 KiB
JavaScript
Executable File

(function( $ ) {
$.widget("metro.hint", {
version: "1.0.0",
options: {
position: "bottom",
background: '#FFFCC0',
shadow: false,
border: false,
_hint: undefined
},
_create: function(){
var that = this;
var o = this.options;
this.element.on('mouseenter', function(e){
that.createHint();
o._hint.stop().fadeIn();
e.preventDefault();
});
this.element.on('mouseleave', function(e){
o._hint.stop().fadeOut(function(){
o._hint.remove();
});
e.preventDefault();
});
},
createHint: function(){
var that = this, element = this.element,
hint = element.data('hint').split("|"),
o = this.options;
var _hint;
if (element.data('hintPosition') != undefined) o.position = element.data('hintPosition');
if (element.data('hintBackground') != undefined) o.background = element.data('hintBackground');
if (element.data('hintShadow') != undefined) o.shadow = element.data('hintShadow');
if (element.data('hintBorder') != undefined) o.border = element.data('hintBorder');
if (element[0].tagName == 'TD' || element[0].tagName == 'TH') {
var wrp = $("<div/>").css("display", "inline-block").html(element.html());
element.html(wrp);
element = wrp;
}
var hint_title = hint.length > 1 ? hint[0] : false;
var hint_text = hint.length > 1 ? hint[1] : hint[0];
//_hint = $("<div/>").addClass("hint").appendTo(element.parent());
_hint = $("<div/>").addClass("hint").appendTo('body');
if (hint_title) {
$("<div/>").addClass("hint-title").html(hint_title).appendTo(_hint);
}
$("<div/>").addClass("hint-text").html(hint_text).appendTo(_hint);
_hint.addClass(o.position);
if (o.shadow) _hint.addClass("shadow");
if (o.background) {_hint.css("background-color", o.background);}
if (o.border) _hint.css("border-color", o.border);
//console.log(_hint);
if (o.position == 'top') {
_hint.css({
top: element.offset().top - $(window).scrollTop() - _hint.outerHeight() - 20,
left: element.offset().left - $(window).scrollLeft()
});
} else if (o.position == 'bottom') {
_hint.css({
top: element.offset().top - $(window).scrollTop() + element.outerHeight(),
left: element.offset().left - $(window).scrollLeft()
});
} else if (o.position == 'right') {
_hint.css({
top: element.offset().top - 10 - $(window).scrollTop(),
left: element.offset().left + element.outerWidth() + 10 - $(window).scrollLeft()
});
} else if (o.position == 'left') {
_hint.css({
top: element.offset().top - 10 - $(window).scrollTop(),
left: element.offset().left - _hint.outerWidth() - 10 - $(window).scrollLeft()
});
}
o._hint = _hint;
},
_destroy: function(){
},
_setOption: function(key, value){
this._super('_setOption', key, value);
}
})
})( jQuery );