【问题标题】:Kendo-UI Tooltip with interactive (clickable) content具有交互式(可点击)内容的 Kendo-UI 工具提示
【发布时间】:2016-02-03 17:32:35
【问题描述】:

如果鼠标在工具提示目标之上,我希望工具提示保持打开状态如果它在工具提示内容(动态加载)之上,以便用户可以移动鼠标从目标到工具提示,然后单击内容中的链接。

我正在寻找的一个很好的例子是当您将鼠标悬停在页面右侧的朋友上时出现在 Facebook 中的弹出窗口...您会看到一个交互式弹出窗口。

我知道我可以通过关闭 AutoHide 并向工具提示内容添加“关闭”按钮来做到这一点,但用户不希望这样做,(这也是不切实际的,因为工具提示在网格中并且在网格上滑动鼠标很容易导致大量工具提示打开并卡住)。

有人做过吗?愿意分享你的 JS 吗? 我很惊讶它不是小部件的内置选项...

干杯, 克里斯

【问题讨论】:

    标签: jquery kendo-ui kendo-tooltip


    【解决方案1】:

    我猜这正是你需要的... Tooltip / Events, Tooltip / Loading content with AJAX

            $("#products").kendoTooltip({
                filter: "a",
                   content: {
                      url: "../content/web/tooltip/ajax/ajaxContent1.html"
                   },
                   width: 220,
                   height: 280,
                   position: "top",
                   requestStart: function(e) {
                      e.options.url = kendo.format(urlFormat, e.target.data("id"));
                  }
            });
    

    如果您在浏览器中签入网络选项卡,那么当您将鼠标悬停在图像上方时,您将能够看到产品名称已加载到工具提示中。

    同样,您可以加载工具提示内容。

    • 自动隐藏:假

    在声明工具提示时设置此选项。检查此链接:Tooltip / Events

    $("#autohide-false").kendoTooltip({
        autoHide: false,
        show: onShow,
        hide: onHide,
        position: "top",
        content: "Hello!"
    });
    

    content部分可以如上例所示加载。

    【讨论】:

      猜你喜欢
      • 1970-01-01
      • 2015-10-10
      • 1970-01-01
      • 1970-01-01
      • 1970-01-01
      • 1970-01-01
      • 1970-01-01
      • 1970-01-01
      • 2013-12-11
      相关资源
      最近更新 更多