jQuery技术:在jQuery工具提示函数中添加一个链接

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

这是我目前用于工具提示的内容

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

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

    例:-

     $( "a" ).tooltip({ open: function( event, ui ) { $(ui.tooltip).append('google'); } }); 

    如果用户将元素hover,jQueryUI工具提示不会停留。

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

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

    自己构建它

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

     

    使用其他工具提示插件

    这里有25个不同的工具提示,其中一些允许您在工具提示中放置任何您喜欢的内容。

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

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

    这是一个独立的演示

    您可以对指针事件发表以下注释 –

    需要了解更多jQuery教程分享在jQuery工具提示函数中添加一个链接,都可以关注jQuery技术分享栏目—计算机技术网(www.ctvol.com)!

     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 */ } 

      以上就是jQuery教程分享在jQuery工具提示函数中添加一个链接相关内容,想了解更多jQuery开发(异常处理)及jQuery教程关注计算机技术网(www.ctvol.com)!)。

      本文来自网络收集,不代表计算机技术网立场,如涉及侵权请联系管理员删除。

      ctvol管理联系方式QQ:251552304

      本文章地址:https://www.ctvol.com/jquerytutorial/981796.html

      (0)
      上一篇 2021年12月12日
      下一篇 2021年12月12日

      精彩推荐