jquery - zeroClipboard 复杂的css问题

Question

我有图像列表，鼠标悬停在其下方会显示选项框，其中嵌入了要从中复制的代码输入框。现在我在它上面实现了 zeroclipboard，使复制功能在点击时起作用，所以当我将鼠标悬停在图像上时，它会正确显示选项框，但是当我用鼠标点击输入框复制代码时，选项得到关闭，认为它不再在选项 div 中，因为 zeroclipboard 在它上面有 div，所以鼠标继续它并关闭。

所以解决方案是在选项 div 中创建该 div，它一直在处理，但现在 zeroclipboard div 样式显示错误，我不知道如何修复它。

以下是zeroclipboar的样式，我不知道要在上面设置什么样式，所以它在输入框上方，所以我可以点击它，所以它像往常一样正常工作。

    on line 107 in zeroclipboard.js
var style = this.div.style;
    style.position = 'absolute';
    style.left = '' + box.left + 'px';
    style.top = '' + box.top + 'px';
    style.width = '' + box.width + 'px';
    style.height = '' + box.height + 'px';
    style.zIndex = zIndex;

Answer 1

$("input[name='htmlcode'], input[name='directlink'], input[name='emaillink'], input[name='imgcode']").live('mouseover', function() {

        clip = new ZeroClipboard.Client();
        clip.setHandCursor( true );
        clip.setText($(this).val());

        var width = $(this).width();
        var height =  $(this).height()+10;
        var flash_movie = '<div>'+clip.getHTML(width, height)+'</div>';
        // make your own div with your own css property and not use clip.glue()
        flash_movie = $(flash_movie).css({
            position: 'relative',
            marginBottom: -height,
            width: width,
            height: height,
            zIndex: 101
            })
        .click(function() { // this puts copied indicator for showing its been copied!
            $(this).next('input').indicator({className: 'copied', wrapTag: 'div', text: 'Copied!', fadeOut: 'slow', display: 'after'});
        });

        $(this).before(flash_movie); // if you want to put after and not before, then you have to change the marginBottom to marginTop
    });