零剪贴板悬停答案

【问题标题】：zeroclipboard hover零剪贴板悬停
【发布时间】：2011-01-12 03:17:22
【问题描述】：

我正在尝试实现在retailmenot.com 上使用的闪存组件，但我遇到了一些问题。

经过几天的搜索，我成功地使用 zeroclipboard flash 元素检查了我的多个优惠券代码，当我单击一个以使用该链接打开一个新网址时。

我现在做不到，我尝试使用几种 jQuery 方法是在我所在的悬停元素的右侧显示“复制和打开站点”框。它看起来像一个工具提示。

我尝试将方法 $('.class_element').hover( function (){ } display new div on the left) 应用于不可见 flash 下的 dom 元素，但由于 flash 在顶部，它没有被触发。

我做的另一个尝试是修改 Zeroclipboard.js 文件并添加一个 id 到包含 flash 的绝对 div，并在其上添加悬停事件，但仍然没有成功。

我也尝试使用 Zeroclipboard 元素中的 addEventListner('mouseover', function(){}) 但没有成功。

您能否建议我如何为位于 dom 元素顶部的 flash 组件制作某种工具提示？

谢谢！

【问题讨论】：

标签： jquery css hover zeroclipboard

【解决方案1】：

默认情况下，Flash 在单独的窗口中呈现，而不是在 DOM 中。要使 Flash 进入 DOM，请将参数 wmode 添加到 opaque。如果您使用 swfobject 加载 flash，则语法为：

so.addParam('wmode','opaque');

此外，Flash 元素需要知道容纳它的容器的高度和宽度，因此当鼠标悬停时不能使用.hide() 和.show()。我从 jQuery UI 选项卡中学到的技巧之一是将“隐藏”元素置于负位置。需要时放正位，不需要时放回负位。

【讨论】：

【解决方案2】：

添加事件监听器应该可以工作。我将它们与 OpenTip 结合使用。我就是这样做的：

var clip = new ZeroClipboard($("#copy-button"));
clip.addEventListener('onMouseOver', function(){
    console.log("mouseOver"); // code to show tool tip goes here
});

clip.addEventListener('onMouseOut', function(){
    console.log("mouseOut"); // code to hide tool tip goes here
});

【讨论】：