Primefaces p：overlayPanel喜欢facebook [重复]答案

【问题标题】：Primefaces p:overlayPanel like facebook [duplicate]Primefaces p：overlayPanel喜欢facebook [重复]
【发布时间】：2014-07-03 20:48:49
【问题描述】：

我需要一个像 facebook 这样的 overlayPanel。 1) 朋友 -> 将鼠标悬停在朋友上 -> 出现一个带有一些选项的面板（添加朋友、可变朋友......） 2) 我可以将鼠标悬停在此面板上并单击按钮 3) 如果我将鼠标悬停在外面，面板就会消失。

我该怎么做？我认为我需要正确的 showEvent 和 hideEvent。但是什么是正确的？非常感谢您的帮助

【问题讨论】：

p:overlayPanel 是正确的组件。展示中有一个示例：primefaces.org/showcase/ui/overlay/overlayPanel.xhtml - 只需将示例中的 dataTable 替换为您需要的组件和事件即可。
是的，没错。我知道这个组件。我的问题是：什么是正确的事件？我尝试了一些方法，但找不到正确的解决方案。请你帮帮我。

标签： primefaces overlay

【解决方案1】：

我会说showEvent="mouseover" 和hideEvent="mouseout" 是您要找的。p>

【讨论】：

hideEvent="mouseout" 不完全是我想要的。还有哪些其他 hideEvents？
我不知道您在寻找什么。我以为您希望在将鼠标移离元素时使覆盖面板消失。那么你能具体说明一下吗？ Here 你可以找到关于鼠标事件的很好的概述。也许在那里你可以找到你要找的东西。
我正在寻找与 facebook 中相同的内容：悬停一个朋友的名字（是一个链接）-> 出现一个新的 overlayPanel -> 我可以将鼠标悬停在此 overlayPanel 上并单击一些按钮（例如“添加朋友”）->如果我将鼠标移出面板-> outputPanl 消失。
对这个问题有什么想法吗？
有什么帮助吗？ 6 个多月前 :(

【解决方案2】：

刚刚在这个问题中找到了解决方案： Latency issue with Primefaces overlayPanel - loads to lazy

这成功了：

<p:overlayPanel .... onShow="onShowOverlayPanel(this)" ...>

function onShowOverlayPanel(ovr) {
    ovr.jq.on("mouseleave", function(e) {
        ovr.jq.hide();
    });
}

【讨论】：