zclip is not working when i bind that on a hidden element

248 views Asked by At

I want to have a copy button on my website which copies text of a div to the clipboard, since javascript does not have access to clipboard directly therefore, i'm using zclip for that, but when i bind zclip to a hidden element and when i show that element than zclip does not work or bind on that please help me out.

HTML Code:

<span class="homebutton">Get code for this theme</span>
<div class="get_code">
    <pre class="theme_code"><?php echo $theme['theme_code'];?></pre>
    <div class="copy_code">Copy</div>
</div>

jQuery Code:

$('.homebutton').click(function(){
    $('.get_code').show('slow');
});

$('.copy_code').zclip({
    path: "js/ZeroClipboard.swf",
    copy: function(){return $('.theme_code').text();},
    afterCopy: function() {}
});

Thanks in advance!

1

There are 1 answers

0
AudioBubble On BEST ANSWER

I've got the solution i tried binding the event on setTimeout function and it worked as i needed.. :)

I'm sharing that code hope it will help other people!

HTML code:

<span class="homebutton">Get code for this theme</span>
<div class="get_code">
    <pre class="theme_code"><?php echo $theme['theme_code'];?></pre>
    <div class="copy_code">Copy</div>
</div>

jQuery Code:

$('.homebutton').click(function(){
    $('.get_code').show('slow');
    setTimeout(function(){bind_zclip();},1000);
});

function bind_zclip()
{
    $('.copy_code').zclip({
        path: "js/ZeroClipboard.swf",
        copy: function(){return $('.theme_code').text();},
        afterCopy: function() {}
    });
}