如何显示简单的文本框，当我使用jQuery悬停在图标(How to show a simple te

我有一个HTML的输入字段和帮助图标（？）字段旁边，当我将鼠标悬停在我要显示简单的文本消息和文本消息应该上徘徊远消失的图标。 任何方式做到这一点使用jQuery？

图标将是一个简单的图片说一个小的问号。 文本将是“在框中输入您的姓名”

Answer 1:

您可以使用“工具提示”旅行文本用鼠标而它的图标，

这里是一个很好的例子。

http://www.alessioatzeni.com/blog/simple-tooltip-with-jquery-only-text/

这也是一个很好的例子，可以实现鼠标移出以类似的方式！

http://api.jquery.com/mouseover/

检查这个例子太多，

http://jsfiddle.net/DLQsX/

Answer 2:

动态创建DOM元素，则其定位使用所述目标元件的偏移固定。 您可以将目标元素的mouseout事件创作的mousein事件的元素，而破坏。

假设你的目标页面元素有一个ID身份识别码：

添加到您的待机功能，或在脚本标签的身份识别码元素已被宣布后：

$('#myId').mouseenter(function(){
    $('body').append("<div id='hoveringTooltip' style='position:fixed;'></div>");
    $('#hoveringTooltip').html("MY TOOLTIP TEXT GOES HERE");
    $('#hoveringTooltip').css({
        "top" : $(this).offset().top + MYTOPOFFSET,
        "left" : $(this).offset().left + MYLEFTOFFSET
    });
});
$('#myId').mouseleave(function(){
    $('#hoveringTooltip').remove();
});

Answer 3:

见jQuery的悬停事件 。

$("#help_icon").hover(function(){
    $("#msg_div").hide();
    $("#msg_div").show();
});

Answer 4:

$("#help_icon").hover(
  function () {
    $("#msg_div").show();
  }, 
  function () {
    $("#msg_div").hide();
  }
);

从在同一条链路jjclarkson的答案

文章来源: How to show a simple textbox when I hover over an icon using jquery