trouble with ZeroClipboard of add a tooltip
I'm trying to use Zeroclipboard http://code.google.com/p/zeroclipboard/ to copy stuff to the clipboard and add a tooltip when the mouse hover on the flash. but it doesn't seem to be working.
my html code:
<div rel="<?php echo $url;?>" class="cp-code">copied code</div>
<div class="test" style="display: none; border: 1px solid #ccc; padding: 8px;">click copy,test,test</div>
My js code: i have added the jquery library.
ZeroClipboard.setMoviePath("http://example.com/js/ZeroClipboard.swf");
var clip = null;
var url = '';
function init() {
clip = new ZeroClipboard.Client();
clip.setHandCursor( true );
$('.cp-code').mouseover( function() {
clip.setText(this.innerHTML);
$('test').style.display = 'block';
if (clip.div) {
clip.receiveEvent('mouseout', null);
clip.reposition(this);
} else {
clip.glue(this);
}
开发者_如何学JAVAclip.receiveEvent('mouseover', null);
url = $(this).attr('rel');
});
clip.addEventListener('mouseUp', function(client) {
window.open(url);
});
clip.addEventListener('mouseOut', function (client) {
$('test').style.display = 'none';
});
}
$(document).ready(function() {
init();
});
Why do you want it to happen on mouseover? I'm not sure if ZeroClipboard supports that.
It took me a little while to figure this out when I first used ZeroClipboard because it's implementation is a bit different from normal. However, you can't just call clip.setText. You have to 'glue' the clip implementation to the control. And you can't use the jQuery object either, you have to glue it to the actual DOM object.
So, for example:
var cpCode = $('.cp-code');
cpCode.each(function()
{
clip = new ZeroClipboard.Client(); //you can set the movie path here too
clip.glue($(this)[0]); // The [0] accesses the actual DOM object rather than the jQuery object
clip.setText($(this).html();
});
So now when you click the element, the text will be copied.I see where your doing some other stuff in your example, but regardless, I think the element your missing is gluing the DOM object to the instance of clip, rather than calling clip.setText on your jQuery mouseover event.
精彩评论