2

我一直在寻找一段时间,也许我没有使用正确的术语,但我试图找出如何在 jQuery 工具提示中放置一个链接,所以当它弹出时,我可以在它。我可以在标题中写出链接吗title="<a href=""></a>">

这是我目前的工具提示

      $(function() {
        $( document ).tooltip({
          position: {
            my: "center bottom-20",
            at: "center top",
            using: function( position, feedback ) {
              $( this ).css( position );
              $( "<div>" )
                .addClass( "arrow" )
                .addClass( feedback.vertical )
                .addClass( feedback.horizontal )
                .appendTo( this );
            }
          }
        });
      });
4

5 回答 5

2

如果用户将鼠标悬停在元素上,jQueryUI 工具提示不会一直存在。

首先添加到 jQueryUI 工具提示的链接是一个坏主意,因为用户将无法单击它(除非你真的很快)

于 2013-04-29T17:53:59.783 回答
1

如果您想要更复杂的工具提示,该title属性很可能无法满足您的需求。以下是一些建议:

自己建造

在你的 dom 中的某个地方有一个隐藏的 div 并用它来替换标准的工具提示。使用 jQuery 显示它并将其放置在需要的任何位置。如果您愿意,可以与 jQueryUI 的内容选项一起使用。

<div id="tooltip">
  <div class="tooltipText"></div>
  <div class="menu">
    ....
  </div>
</div>

使用不同的工具提示插件

这里有 25 种不同的工具提示,其中一些允许您在工具提示中放置您喜欢的任何内容。 http://designshack.net/articles/javascript/25-useful-resources-for-creating-tooltips-with-javascript-or-css/

于 2013-04-29T16:41:09.357 回答
1

您可以评论以下关于指针事件的行 -

div.tooltip {
  position: absolute;   
  text-align: center;   
  width: 60px;  
  height: 28px;     
  padding: 2px; 
  font: 12px sans-serif;    
  background: lightsteelblue;   
  border: 0px;                  
  border-radius: 8px;

 /*  pointer-events: none;  This line needs to be removed */

}
于 2015-06-23T16:36:10.107 回答
0

如果您想动态地将内容插入到工具提示中,您可以订阅工具提示的“打开”事件。

http://jsfiddle.net/PagNg/

例子:-

$( "a" ).tooltip({
  open: function( event, ui ) {
      $(ui.tooltip).append('<a href="http:\\www.google.com">google</a>');
  }
});
于 2013-04-29T16:41:36.097 回答
0

工具提示的原生设计依赖于不同的假设,因此您需要的行为(允许用户单击其内容的粘性工具提示)不受官方支持。

无论如何,看看这个链接,你可以看到使用 jQuery 工具实现你需要的东西是可能的:

http://jquerytools.org/demos/tooltip/any-html.html

这是一个独立的演示

http://jquerytools.org/demos/tooltip/any-html.htm

于 2013-09-25T06:18:34.377 回答