Javascript tooltip

Run Settings
LanguageJavaScript
Language Version
Run Command
//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(''); }); });
Editor Settings
Theme
Key bindings
Full width
Lines