//Right
function right(e) {
if(parseInt($(window).innerWidth()) - parseInt($(e).offset().left) - parseInt($(e).css('width')) < $('.tip').innerWidth()) {
_top(e);
}
else {
$('.tip').css({
'margin-top': $(e).offset().top + parseInt($(e).css('padding-top')) / 2,
'margin-left': $(e).offset().left + parseInt($(e).css('width')) + parseInt($(e).css('padding-left')) + parseInt($(e).css('padding-right')) + 5
});
}
}
//Bottom
function bottom(a) {
if($('.tip').innerHeight() > parseInt($(window).innerHeight()) - parseInt($(a).offset().top) - parseInt($(a).css('height')) - parseInt($(a).css('padding-top')) - parseInt($(a).css('padding-bottom'))) {
_top(a);
}
else {
$('.tip').css({
'margin-top': $(a).offset().top + parseInt($(a).css('padding-top')) + parseInt($(a).css('padding-bottom')) + parseInt($(a).css('height')) + 5,
'margin-left': $(a).offset().left
});
}
}
//Left
function left(q) {
if(parseInt($('.tip').css('width')) > $(q).offset().left) {
_top(q);
}
else {
$('.tip').css({
'margin-top': $(q).offset().top + parseInt($(q).css('padding-top')) / 2,
'margin-left': $(q).offset().left - parseInt($(q).css('width')) - parseInt($(q).css('width')) - parseInt($(q).css('padding-left')) - parseInt($(q).css('padding-right')) - 15
});
}
}
//Top
function _top(m) {
if($('.tip').innerHeight() > $(m).offset().top) {
left(m);
}
else {
$('.tip').css({
'margin-top': $(m).offset().top - parseInt($(m).css('padding-top')) - parseInt($(m).css('height').split('p')[0]) - parseInt($(m).css('padding-bottom')),
'margin-left': $(m).offset().left
});
}
}
$('.tooltip').on('mouseover', function() {
$('.tip').fadeIn(80);
$('.tip').html($(this).attr('data-tooltip'));
switch($(this).attr('data-tooltip-pos')) {
case 'right': right($(this));break;
case 'left': left($(this));break;
case 'top': _top($(this));break;
case 'bottom': bottom($(this));break;
default: console.log('Expected position value left/right/top/bottom in attribute data-tooltip-pos. ' + $(this).attr('data-tooltip-pos') + ' seen!');
}
});
$('.tooltip').on('mouseout', function() {
$('.tip').fadeOut(0, function() {
$('.tip').html('');
});
});