1

我在我的项目中使用 HTML 表格并通过 jquery-ui 显示工具提示。但我想在 mouseenter 和 mouseleave 隐藏时添加“mydiv”作为提示。

  <div id="mydiv">
    <input type="button"  value="Delete"/>
    <input type="button"  value="Edit"/>
</div>

请帮忙

4

3 回答 3

0

可能你需要Jquery qTip

$(this).qtip({
      content: divId // Use the contents of the child myqtip-content element.
      style: 'cream'
   });

（如果您不想使用任何插件，请忽略）

于 2013-03-30T11:37:30.783 回答
0

演示中有一个非常好的自定义内容示例。

http://jqueryui.com/tooltip/#custom-content

点击view source查看代码并进行相应调整

于 2013-03-30T11:48:44.170 回答
0

试试这个示例代码

<!doctype html>

<html lang="en">
<head>
  <meta charset="utf-8" />
  <title>jQuery UI Tooltip - Default functionality</title>
  <link rel="stylesheet" href="http://code.jquery.com/ui/1.10.2/themes/smoothness/jquery-ui.css" />
  <script src="http://code.jquery.com/jquery-1.9.1.js"></script>
  <script src="http://code.jquery.com/ui/1.10.2/jquery-ui.js"></script>
  <link rel="stylesheet" href="/resources/demos/style.css" />
  <script>
  $(function() {
    $( document ).tooltip();
  });
  </script>
  <style>
  label {
    display: inline-block;
    width: 5em;
  }
  </style>
</head>
<body>

<p><a href="#" title="That's what this widget is">Tooltips</a> can be attached to any element. When you hover
the element with your mouse, the title attribute is displayed in a little box next to the element, just like a native tooltip.</p>
<p>But as it's not a native tooltip, it can be styled. Any themes built with
<a href="http://themeroller.com" title="ThemeRoller: jQuery UI's theme builder application">ThemeRoller</a>
will also style tooltips accordingly.</p>
<p>Tooltips are also useful for form elements, to show some additional information in the context of each field.</p>
<p><label for="age">Your age:</label><input id="age" title="We ask for your age only for statistical purposes." /></p>
<p>Hover the field to see the tooltip.</p>


</body>
</html>

演示：

更多样品

于 2013-03-30T12:32:27.987 回答