解决KindEditor图片上传对话框位置异常问题(浏览器放大缩小时对话框不见了)
来源:互联网 发布:淘宝助理没有宝贝管理 编辑:程序博客网 时间:2024/06/08 02:26
问题:使用KindEditor上传图片,当浏览器缩小或者放大的时候,上传对话框会不见了。
原因是当浏览器放大缩小时,窗口的 innerHeight 和 innerWidth 成倍变化。
但是动态加载的对话框的位置的top和left值还是缩放100%状态下的值。
所以解决思路是:当对话框加载完之后,使用 JS+CSS 控制该对话框的位置。
查看KindEditor图片上传对话框 的结构是:
<div class="class="ke-dialog-default ke-dialog"> <div class="ke-dialog-content"></div> <div class="ke-dialog-shadow"></div></div>
查看KindEditor官方文档:
这里要注意,一定要在回调函数体里获取和设置对话框位置。
因为是异步加载,其他位置获取或设置可能获取不到该对话框Dom
//获取浏览器窗口内外高度
<pre name="code" class="javascript">var inHeight = window.innerHeight;var inWidth = window.innerWidth;var outHeight = window.outerHeight;var outWidth = window.outerWidth;
顺便学习一下JS(JQuery)获取和设置元素位置的操作
//纯JSdocument.getElementById("child").style.left="800px";document.getElementById("child").style.top="200px";//offset()获取当前元素基于浏览的位置 var offsettop=$("#unamespan").offset().top; var offsetleft=$("#unamespan").offset().left; //position()获取当前元素基于父容器的位置 var positiontop=$("#unamespan").position().top; var positionleft=$("#unamespan").position().left; //设置panel2的位置基于unamespan的坐标 $("#panel2").css({position: "absolute",'top':offsettop+100,'left':offsetleft+50,'z-index':2});
0 0
- 解决KindEditor图片上传对话框位置异常问题(浏览器放大缩小时对话框不见了)
- 解决mxGraph放大/缩小在非IE浏览器下overlay图标位置不变化的问题
- 商城项目实战22:解决KindEditor上传图片浏览器兼容性问题
- UIPinchGestureRecognizer 放大缩小图片问题
- 上传图片保存位置问题 KindEditor…
- 放大对话框时,改变按钮的位置(EasySize.h使用方法)
- flex实现图片根据鼠标的滚动放大或缩小(以鼠标的的位置 为中心放大缩小)
- kindeditor-4.1.10解决上传图片之后全屏显示问题?
- Glide配合PhotoView使用时,图片放大缩小时宽高显示出问题解决记录(新更新)
- windows下QT对话框禁止放大缩小以及拖动
- MFC控件随着对话框等比例放大或缩小
- MFC控件随着对话框等比例放大或缩小
- java kindeditor 上传图片问题
- 解决kindeditor与Struts2框架整合时无法上传本地图片的问题
- 解决kindeditor上传图片时发生“服务器发生故障”的问题
- 解决kindeditor与Struts2框架整合时无法上传本地图片的问题
- 解决kindeditor与Struts2框架整合时无法上传本地图片的问题 (1)
- 解决kindeditor与Struts2框架整合时无法上传本地图片的问题 (2)
- Harris角点检测原理及openCV实现
- 会场安排问题
- systemtap
- 程序存储问题
- HDU 2896 病毒侵袭
- 解决KindEditor图片上传对话框位置异常问题(浏览器放大缩小时对话框不见了)
- acdream 1064 完美数 (数位dp)
- 十分钟让你明白Objective-C的语法(和Java、C++的对比)
- nginx location匹配规则
- POJ2503 Babelfish Tire树
- winform 中panel动态添加控件坐标原点问题
- 列表 环 判定 初始位置
- 3Sum
- iOS学习之 plist文件的读写