Question

我正在使用一个Web应用程序，当用户将鼠标移动到页面的特定部分时，我们需要显示模式样式内容，因为他们将鼠标移离该区域，尽管我们想要关闭模态内容。

我目前正在与SimpleModal合作并让它展示，但您必须点击关闭。有没有人知道基于鼠标移动关闭的方法？或类似的。

或者我可以使用的其他组件。实际上我们正在做的是显示过于强大的工具提示，恰好是iFrame内容。所以如果你知道一个jQuery工具提示函数，它将支持显示一个可以工作的iFrame。

Answer 1

使用工具提示插件并不容易，它实际上具有您正在关注的行为（在悬停元素时显示/隐藏一个框）？

我认为最好的是 qTip 。

它可以显示简单的工具提示，通过ajax加载内容，显示高级内容（不仅仅是文本），具有高度的风格，并提供完整的api可以使用。

与此同时，我对SimpleModal了解不多，因为你没有显示任何javascript，我只能猜测你是如何创建模态对话框的。

无论如何，jQuery提出了.hover()方法来处理用鼠标输入元素并离开它的情况。你这样使用：

$('#myelement').hover(
    // this function is executed when entering the element with the mouse
    function(e) {
        // create you SimpleModal here
    },
    // this one when leaving
    function(e) {
        // close it here
        // from the SimpleModal doc, you close the currently opened modal with
        $.modal.close()
    }
);

<强> DEMO

Answer 2

要关闭SimpleModal，请执行

$.modal.close()

所以我建议将它与jQuery中的mouseleave()一起使用。

$("SELECTOR_FOR_YOUR_AREA").mouseleave($.modal.close);

用户移动鼠标后自动关闭简单模态？

2 个答案: