0

在我开始使用 twitter bootstrap css 框架之前，我一直在成功使用 zclip 复制到剪贴板功能。现在我似乎不能再使用 zclip 了，有人有解决方案吗？

部分测试结果：

这是我使用 zclip 的方法：

    $('.test').zclip({
        path:"{{ asset('bundles/yopyourownpoet/flash/ZeroClipboard.swf') }}",
        copy: 'test',
        afterCopy:function(){
            alert('The poem has been copied to the clipboard.');
        },
    });

这适用于以下 html：

<div class='test'>test</div>

但是每当我尝试使用图像时，它就不再起作用了，flash 的东西不会出现：

<div class='test'><img src="{{ asset('bundles/yopyourownpoet/images/Star.png') }}" alt="Star" height="100" width="100" /></div>

在我开始使用 bootstrap 之前，这工作得很好......关于使用 zclip 和 bootstrap 的任何提示，并且在图像上有 flash 的东西吗？非常感谢。

4

1 回答 1

2

好吧，经过多次尝试，我终于让它工作了。我不得不恢复到 zeroclipboard 并且不再使用 zclip。这是有效的代码：

    <div id="d_clip_container" style="position:relative; bottom: 25px; display: inline;">
        <img id='d_clip_button' style="position:relative; top: 25px;" src="{{ asset('bundles/yopyourownpoet/images/CopyPoemPage8.png') }}" alt="Copy Poem" height="71" width="300" />
    </div>

-

    ZeroClipboard.setMoviePath("{{ asset('bundles/yopyourownpoet/flash/ZeroClipboard.swf') }}");
    var clip = new ZeroClipboard.Client();
    clip.setText( 'text to copy' );
    clip.glue( 'd_clip_button', 'd_clip_container' );
    clip.setHandCursor( true );

请注意，我必须使用一个技巧，容器底部 25px 和图像顶部 25px，以便 flash 的东西与图像叠加。

这很好用，只是在悬停图像时光标并不总是变为指针。

我认为这个解决方案有点阴暗，所以如果有人有更好的解决方案，请分享。

于 2012-07-08T03:39:11.750 回答