在Anchor Tag的工具提示中显示DIV

时间:2012-12-10 06:30:44

标签: jquery jquery-ui tooltip jquery-tooltip jquery-ui-tooltip

我对Jquery很新。我所看到的一切看起来都很奇怪..我需要将DIV部分显示为Anchor Tag的工具提示。我能够切换DIV的可见性。但是,它没有显示为工具提示,而是显示在屏幕的右上角。是否可以像显示锚标记的工具提示一样显示DIV部分..

提前致谢..

<div id = "contact" class = "tooltip" style="display: none">
<asp:Label Font-Bold = "true" ID = "custLbl" runat = "server" Text = "Phone: " ></asp:Label>
<asp:Label Font-Bold = "true" ID = "custMobLbl" runat = "server" Text = "" ></asp:Label>
<br />
<asp:Label Font-Bold = "true" ID = "custLbl2" runat = "server" Text = "Mail:  " ></asp:Label>
<asp:Label Font-Bold = "true" ID = "custMailLbl" runat = "server" Text = "" ></asp:Label>
</div>

    $(function () {
        $('.contactLink').hover(function () {
            $('#contact').show();
        }, function () {
            $('#contact').hide();
        });
    });



<a  class = "contactLink" href="javascript:void();"> Click me </a>

1 个答案:

答案 0 :(得分:0)

将此添加到页面

var mouseX;
var mouseY;
$(document).mousemove( function(e) {
   mouseX = e.pageX; 
   mouseY = e.pageY;
}); 

然后将代码更改为

$(function () {
        $('.contactLink').hover(function () {
            $('#contact').show();
            $('#DivToShow').css({'top':mouseY,'left':mouseX}).show();
        }, function () {
            $('#contact').hide();
        });
    });