javascript - How to dynamically change the position of an absolute tooltip base on the target element -


i trying make tooltip shows table (in example below used large amount of text). i've wanted change position of tooltip when hover on target element @ corner of screen.

here fiddle

$("strong").on("mouseover", function(){ var $this = $(this), strongtext = $this.text(); $tooltipcontainer.show(); $tooltipcontainer.append('<span>'+ strongtext + '</span>'); }).on("mousemove", function(mousepos){... 

you can change mousemove code little update top position if overlap there below. check demo - fiddle

on("mousemove", function(mousepos){     var overlap = mousepos.pagey + possrolly + $tooltipcontainer.height() - $(window).height() - $(window).scrolltop();     $tooltipcontainer.css({         left: mousepos.pagex,         top: mousepos.pagey + possrolly - ( overlap > 0 && overlap )     }); }) 

Comments

Popular posts from this blog

Delphi XE2 Indy10 udp client-server interchange using SendBuffer-ReceiveBuffer -

Qt ActiveX WMI QAxBase::dynamicCallHelper: ItemIndex(int): No such property in -

Enable autocomplete or intellisense in Atom editor for PHP -