javascript - div won't display on image hover -
can't figure out why div won't display on hover appreciated.
$('a[rel=tooltipimage]').bind('mouseover',function(e){ e=e?e:window.event; $('#tooltip').css({ position:'absolute', top:e.pagey, left:e.pagex }); })
html:
</span> <a href="#" class="tooltipimage"><img src="/applications/images/icons/info_icon.gif"/></a> </span> <div class="tooltip" style="margin:0 0 0 18px; display:none;"> <b>tooltip text goes here</b><br /> </div>
all i'm trying display div floating next image when mouseover , disappear when leave. have jquery installed , don't want put in bunch of addons , stuff when need simple of tooltips. if wasnt in classic asp use modalpopup unfortunately no luck.
thanks in advance, nickg
if can change of html, not have use javascript (unless positioning has dynamic. can set using javascript). can plain css. if want small text, can use title attribute
<span class="tooltipimage"> <a href="#"><img src="/applications/images/icons/info_icon.gif"/></a> <label>tooltip text goes here</label> </span> .tooltipimage:hover label{ display:block; } .tooltipimage label{ display:none; position:absolute; top:0px; left:20px; } .tooltipimage{ display:block; position:relative; }
Comments
Post a Comment