zClip使用时ZeroClipboard生成的位置不对的问题
zclip官网:http://steamdev.com/zclip
我之前在另外一篇博文里面写了一个解决生成的位置不对的问题,请参考:http://www.cnblogs.com/longshiyVip/p/4663870.html,但是最近按照之前的方式发现不管用,于是又开始需求解决方案,就是下面的这个方案。
zClip是个很好的兼容浏览器的复制到剪贴板的解决方案。zClip在简单干净的页面时工作正常,但放到工作平台的框架里面去以后就不工作了。ZeroClipboard取到的offsetTop和offsetLeft不对。通过firebug调试半天才知道原因。
在执行初期绑定代码后:
<script type="text/javascript">
$(document).ready(function () {
$("a#copy-dynamic").zclip({
path: 'js/ZeroClipboard.swf',
copy: function () { return $('input#dynamic').val(); },
afterCopy: function () { alert("ok"); }
});
});
</script>
这段代码会自动在id="copy-dynamic”的控件后生成以下代码:
<div class="zclip" id="zclip-ZeroClipboardMovie_1"
style="position: absolute; left: 10px; top: 33px; width: 258px; height: 14px; z-index: 99;">
<embed id="ZeroClipboardMovie_1" src="js/ZeroClipboard.swf" loop="false" menu="false"
quality="best" bgcolor="#ffffff" width="258" height="14" 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=258&height=14"
wmode="transparent"></div>
其本意是会在id="copy-dynamic”的控件上面覆盖“ZeroClipboard.swf”,检查发现这个位置不对,没有覆盖上去。
修改jquery.zclip.js中的getDOMObjectPosition函数,如下所示:
getDOMObjectPosition: function (obj, stopObj) {
// get absolute coordinates for dom element
var info = {
left: 0,
top: 0,
width: obj.width ? obj.width : obj.offsetWidth,
height: obj.height ? obj.height : obj.offsetHeight
}; if (obj && (obj != stopObj)) {
//info.left += obj.offsetLeft; //修改前
//info.top += obj.offsetTop; //修改前
jpos = $(obj).position(); //修改后
info.left += jpos.left; //修改后
info.top += jpos.top; //修改后
} return info;
}
这里使用了jQuery的position函数。
重新刷新界面,发现这次生成的位置终于对了,成功覆盖到id="copy-dynamic”的控件上面,成功!
zClip使用时ZeroClipboard生成的位置不对的问题的更多相关文章
- Android插件化(三):OpenAtlas的插件重建以及使用时安装
Android插件化(三):OpenAtlas的插件重建以及使用时安装 转 https://www.300168.com/yidong/show-2778.html 核心提示:在上一篇博客 An ...
- adb使用时出现unanthorized问题
adb使用时出现unanthorized问题 ADB 启动时,adb devices出现unanthorized问题. 检查USB调试是否开启. 重新拔插USB数据线是否有授权提示 重启adb :ad ...
- EntityFrameWork 使用时碰到的小问题
EntityFrameWork 使用时碰到的小问题 1,在使用orm访问数据库的相目里,也要引用EntityFrameWork.dll,否则无法使用orm 否则,编译错误 错误 5 "Sys ...
- PowerDesigner15使用时的十五个问题
15个问题列表: No.1:是不是一定要从CDM开始设计,然后在进行PDM的设计? NO.2:工具栏palette不见了,如何把它找出来? NO.3: 如何建立与数据库的关联? NO.4: 域和数据项 ...
- 本地计算机上的XXX服务启动后停止。某些服务在未由其它服务或程序使用时将自动停止。咋整?
用C#写个windows服务,安装部署后去启动时,提示说“本地计算机上的XXX服务启动后停止.某些服务在未由其它服务或程序使用时将自动停止”.咋整?就像下面酱紫: 度娘说不知道咋整,我想把程序附加到w ...
- Toolbar 和 CollapsingToolbarLayout一起使用时menu item无点击反应解决办法
昨天一直在琢磨为什么Toolbar和CollapsingToolbarLayout一起使用时menu item无点击放应的原因,后来在stackoverflow上一条回答,说可能是Toolbar的背景 ...
- jqueryUI中datepicker的使用,解决与asp.net中的UpdatePanel联合使用时的失效问题
1.jqueryUI的datepicker的使用 -->首先在jqueryUI官网上根据你的需要下载适合你系统主题的样式,jqueryUI主题下载地址: -->下载后的文件 jquery- ...
- Netty4.0.24.Final 版本中 IdleStateHandler 使用时的局限性
使用Netty在客户端和服务端建立通讯通道,一般来说,一个连接可能很久没有访问,由于各种各样的网络问题导致连接已经失效,客户端再次发送请求时会产生连接异常. 基于这个原因,需要在客户端和服务端之间建立 ...
- Saiku嵌入系统使用时传参数访问saiku(十六)
Saiku嵌入系统使用时传参数访问saiku Saiku通过iframe嵌入其他系统使用时,我们可以设定参数信息,然后根据url中参数对结果进行筛选哦. 这里我们实现的是根据日期字段进行范围查询,UR ...
随机推荐
- Type of flip id
http://www.haskell.org/pipermail/beginners/2011-March/006477.html The point is that the type of id h ...
- VS mfc MessageBox() 使用英文显示
转载:http://blog.csdn.net/guoyk1990/article/details/44337249 由于特殊原因我们需要将 MessageBox 或 Dialog 的按钮“确定”.“ ...
- UVALIVE 3891 The Teacher's Side of Math
One of the tasks students routinely carry out in their mathematics classes is to solve a polynomial ...
- js面向对象编程(一):封装(转载)
一. 生成对象的原始模式 假定我们把猫看成一个对象,它有"名字"和"颜色"两个属性. var Cat = { name : '', color : '' } 现 ...
- hdu 1422(贪心)
重温世界杯 Time Limit : 2000/1000ms (Java/Other) Memory Limit : 65536/32768K (Java/Other) Total Submiss ...
- <context-param>与<init-param>的区别与作用(转自青春乐园)(
<context-param>的作用:web.xml的配置中<context-param>配置作用1. 启动一个WEB项目的时候,容器(如:Tomcat)会去读它的配置文件we ...
- 阿里云linux下修改mysql默认密码(xampp环境)- 原创
1.修改MySQL的登录设置: # vi /etc/my.cnf 在[mysqld]的段中加上一句:skip-grant-tables 例如: [mysqld] datadir=/var/lib/my ...
- C3P0连接池一些基本配置
C3P0连接池配置 数据库连接是一个耗费大量资源且相当慢的操作,所以为了提高性能和连接速度,诞生了连接池这样的概念. 在多用户并发操作过程中,连接池尤为重要. 它是将那些已连接的数据库连接存放在一个容 ...
- HDU 6273.Master of GCD-差分数组 (2017中国大学生程序设计竞赛-杭州站-重现赛(感谢浙江理工))
Super-palindrome 题面地址:http://acm.hdu.edu.cn/downloads/CCPC2018-Hangzhou-ProblemSet.pdf 这道题是差分数组的题目,线 ...
- Lookup 组件用法全解
Lookup是查找的意思,Lookup组件实现两个数据源的连接,和Join语句实现的功能类似,使用Lookup 组件需要配置: 两个输入:一个是上游数据流的输入Source Table,一个是要查找的 ...