Zeroclipboard 未将 Flash 按钮精确定位在 div 顶部

Question

有趣的是，这在一段时间内完美地发挥了作用，然后突然停止了，据我所知没有任何变化。可能是浏览器缓存的东西。无论如何，我的zeroclipboard代码：

var $j = jQuery.noConflict();
ZeroClipboard.setMoviePath( 'ZeroClipboard.swf' );

$j('document').ready(function() 
{   
    var address = $j('#address').html();
    var clip = new ZeroClipboard.Client();  
    clip.setText( address );
    $j('#get_address_button').mouseover(function() {    
        clip.glue(this);
        clip.addEventListener( 'oncomplete', my_complete );     
    }); 

    function my_complete( client ) {
        alert('The Bitcoin Address: '+address+' has been copied to your clipboard' );   
    }

});

和我的html：

<div id="address" style="display: none"><?php _e($address) ?></div>
<div style="border:1px solid grey; text-align:center; padding:5px; overflow: auto;">    
    <b><?php echo $message ?></b>
    <img src="<?php _e(WP_PLUGIN_URL) ?>/bitcoin-donations-plugin/images/bitcoin_logo<?php _e($image) ?>.png" alt="image here"/>        
    <div style="position:relative; width:100%;">
        <div style="float:left; width:92px; height:40px; background-image:url(<?php _e(WP_PLUGIN_URL) ?>/bitcoin-donations-plugin/images/button.png);""><a href="http://www.weusecoins.com/">What is<br>Bitcoin?</a></div>
        <div style="float:right; width:92px; height:40px; background-image:url(<?php _e(WP_PLUGIN_URL) ?>/bitcoin-donations-plugin/images/button.png);" id="get_address_button">Get My<br>Bitcoin Address</div>
    </div>
</div>

一切正常，但zeroclipboard在胶水顶部创建的隐形闪光按钮（这个）； div 放置在其应有位置以北约 25px 处。 有什么想法吗？

Answer 1

同样在这里，swf 被某个地方的填充物压低，所以过了一会儿我就破解了它。在 ZeroClipboard.js 中更改坐标，如下所示：

 getDOMObjectPosition: function(obj, stopObj) {
        // get absolute coordinates for dom element
        var info = {
            left: 0, 
            top: 0, 
            width: obj.width ? obj.width : obj.offsetWidth, 
            height: obj.height ? obj.height : obj.offsetHeight
        };

Answer 2

解决办法：

阅读文档或者其他脚本后把代码贴上去！

在您的页面中，可以包含在页面加载期间减小其大小的元素，例如手风琴或可扩展菜单。

swf 嵌入的值为 top，但页面加载结束时，其他元素都改变了位置。在发生所有事件之后，您的闪光灯应该考虑它

代码：

$(document).ready(function() {
       var clip = new ZeroClipboard.Client();
       clip.setText( 'Copy me!' );
       clip.setHandCursor( true );
       clip.glue( 'd_clip_button' );
});

Answer 3

我有类似的问题。我实际上最终做的（振作起来）是用 javascript 移动 .swf。它很脏，我并不自豪，但这个问题已经把我带到了理智的边缘。

如果有人有非黑客解决方案，我会洗耳恭听。

Answer 4

值得一提的是，因为它没有在任何其他答案中明确指出：检查以确保您没有任何可能影响定位的 CSS 规则（例如，使用 div 元素选择器）（例如，通过填充或margin) 为 swf 对象所在的 div。

Answer 5

有点黑客，但对我有用。基本上使用计时器和延迟来确保页面上的所有内容都已“稳定”，然后手动将 Flash 元素移动到与按钮相同的绝对位置。需要 JQuery。

在 ZeroClipboard.js 文件中，找到创建 flash div 的行：

this.div = document.createElement('div');

并添加以下行：

this.div.id = 'zeroclip_flash';

现在可以通过 id 操作包含 flash 元素的 div。

在所有其他 ZeroClipboard 启动内容之后，添加以下行：

setTimeout(function() {
    $('#zeroclip_flash').offset( $('#copy').offset() );
}, 500);

其中“clip”是粘合目标元素的 ID。

就像我说的，这是一个 hack，但对于我使用 Chrome 来说，似乎没有其他方法可以工作。