之前写过一个淘宝优惠券连接PC端转手机端连接的小工具，当时写到将转换好的url复制到剪切板这块时解决了IE和火狐，就是没办法搞定Chrome，知道可以通过flash搞定，但是觉得太麻烦没有仔细研究。

今天偶尔发现有ZeroClipboard这么个好玩意，能跨浏览器解决复制剪切板的问题，于是兴冲冲的拿来用用，但是放上去后发现怎么也不成功，绑定的对象鼠标都不变手型。

又换了jquery.zclip.min.js还是不行，真是怀疑最近几天没有休息好，于是去床上躺了一会回来仔细再研究下。

审查元素发现，原来js生成的放swf的div被我的css代码中的一句

div{padding:50px 0 0 0;}

给下移了50像素！！！

再看生成的div的代码：

<divclass="zclip"id="zclip-ZeroClipboardMovie_1"style="position: absolute; left: 392px; top: 213px; width: 800px; height: 30px; /* z-index: 99; */"><embedid="ZeroClipboardMovie_1"src="coupon/ZeroClipboard.swf"loop="false"menu="false"quality="best"bgcolor="#ffffff"width="800"height="30"name="ZeroClipboardMovie_1"align="middle"allowscriptaccess="always"allowfullscreen="false"type="application/x-shockwave-flash"pluginspage="http://www.macromedia.com/go/getflashplayer"flashvars="id=1&width=800&height=30"wmode="transparent"></div>

注意这个div的样式只定义了

1 position: absolute; left: 392px; top: 213px; width: 800px; height: 30px; /* z-index: 99; */

也就是它的margin、padding、float、等等会影响位置的定义还会受公共定义的影响的。

而这个插件是必须上这个DIV覆盖在绑定的元素位置上才OK的。

所以去掉对标签名称div的样式定义，这个好用的跨浏览器复制js正常工作了！

所以以后写css的时候要注意尽量少使用标签定义样式，以免发生类似的问题。