复制代码
代码如下:点击复制效果预览

扩展介绍:1.) 测试兼容IE6,IE7,IE8,FF 3.6,Chrome浏览器8,Safari
5的,歌剧112.) 适当的CSS特效:

复制代码 代码如下:/* zClip is a flash
overlay, so it must provide *//* the target element with “hover” and
“active” classes *//* to simulate native :hover and :active states.
*//* Be sure to write your CSS as follows for best results:
*//*大概意思就是说
ZeroClip是flash叠加……就是说flash叠加在了text文本上,其实显示文字可以根据css来定义*/a:hover,
a.hover {…}a:active, a.active {…}

点击复制效果预览:

在线演示:1、

2.) 在页面代码里写入功能模块,定义copy复制按钮元素属性信息

3.) 供应定制的回调函数。

$.ready{$.zclip({path:'js/ZeroClipboard.swf',copy:$('#callback-paragraph').text(),beforeCopy:function(){$('#callback-paragraph').css('background','yellow');$.css;},afterCopy:function(){$('#callback-paragraph').css;$.css;$.show;

首先下载 Zero Clipboard ,并解压缩。其中需要两个文件:ZeroClipboard.js
和 ZeroClipboard.swf
,将这两个文件放入到你的项目中。点击下载:jquery.zclip.1.1.1

1.) 首先引入核心文件

文本源……

Zero Clipboard 的实现原理

$.ready{$.zclip({path:'js/ZeroClipboard.swf',copy:$.text;// The link with ID "copy-description" will copy// the text of the paragraph with ID "description"$.zclip({path:'js/ZeroClipboard.swf',copy:function(){return $.val;// The link with ID "copy-dynamic" will copy the current value// of a dynamically changing input with the ID "dynamic"});

至此,该插件使用方法已经介绍结束,对于使用者的开发者来说,剩下的扩展方面就要根据需求而定了。

数据解读 ,Zero Clipboard 特点介绍:兼容支持Flash
10避免使用第三方浏览器插件(的Adobe
Flash浏览器中的安全冲突)无形的覆盖,无干扰,页面设计支持CSS“悬停”和“活跃”状态保留目标元素的“点击”,”mouseenter”和”mouseleave”的事件供应回调函数“复制前”和“复制”极轻的重量!

Zero Clipboard 利用 Flash 进行复制,之前有 Clipboard Copy
解决方案,其利用的是一个隐藏的 Flash。但最新的 Flash Player 10 只允许在
Flash 上进行操作才能启动剪贴板。所以 Zero Clipboard
对此进行了改进,用了一个透明的 Flash
,让其漂浮在按钮之上,这样其实点击的不是按钮而是 Flash ,也就可以使用
Flash 的复制功能了。

当开发者需要对某局部文本进行点击复制效果时,在IE下实现比较简单。但要想做到跨浏览器比较困难了。Zero
Clipboard 它利用 Flash 进行复制,所以只要浏览器装有 Flash
就可以运行,而且比IE的document.execCommand 更加灵活。

复制代码 代码如下:

相关文章

网站地图xml地图