Search code examples
javascriptflashinternet-explorer-10vmwarezeroclipboard

ZeroClipboard's transparent .swf showing as opaque white box in IE10?

I have ZeroClipboard implemented in a new application and it's running beautifully in Chrome/FF.

Unfortunately most of the user base is trapped on IE10, and in IE10, I can not get the overlaid flash file to be transparent.

Here's my ZeroClipboard code:

//Set up Click To Clipboard functionality
ZeroClipboard.config({ swfPath: "Scripts/ZeroClipboard.swf" });

var client = new ZeroClipboard($('.field span'));
client.on('ready', function (event) {
    console.log('Copy .swf is loaded');

    client.on('copy', function (event) {
        event.clipboardData.setData('text/plain', event.target.innerHTML);
    });

    client.on('aftercopy', function (event) {
        console.log('Copied text to clipboard: ' + event.data['text/plain']);
    });
});

client.on('error', function (event) {
    console.log('ZeroClipboard error of type "' + event.name + '": ' + event.message);
    ZeroClipboard.destroy();
});

This still functions/copies properly, but I just get an opaque white box covering the bound objects when the user hovers.

This behavior also happening for me in IE10 on the ZeroClipboard demo site, so I'm pretty sure my code is okay... enter image description here

Is this a known bug with Flash transparency and IE10? (Hopefully with a solution?)

I am using the latest version of ZeroClipboard (v2.2) and have updated flash repeatedly. Any help with resolving this would be much appreciated!

Solution

  • The culprit was an IE Add-On called the "VMWare Adobe Flash Optmizer".

    When enabled it appears to be hosing Flash transparency.

    Disabling the add-on lets my ZeroClipboard code run without issue!