kindeditor编辑器点中图片滚动条往上顶的bug


Posted in Javascript onJuly 05, 2015

比如现在我插入两张图片,

kindeditor编辑器点中图片滚动条往上顶的bug

无论我点击哪张图片,里边的滚动条都会往上顶。

本来以为往上会有解决方法,一查结果没有;然后想着去官网查查,然而什么都没有,想到官网提交这个bug,结果没地方提交。

怎么解决,如果单是解决这个bug,去研究源码,我觉的是吃力不讨好的。

然后我就直接从 click、mousedown 这两个事件找起,找它们获得高度的地方,然后 感觉是的话就console.log下,看是不是。然后就找到了。

在这个函数里

pos : function() {
var self = this, node = self[0], x = 0, y = 0;
if (node) {
if (node.getBoundingClientRect) {
var box = node.getBoundingClientRect(),
pos = _getScrollPos(self.doc);
x = box.left + pos.x;
y = box.top + pos.y;
} else {
while (node) {
x += node.offsetLeft;
y += node.offsetTop;
node = node.offsetParent;
}
}
}
return {x : _round(x), y : _round(y)};
},

主要就是 那个box.top这里,不知道为什么,其他调用的时候都没问题,就是点击图片的时候它就变成负数,估计它是获得img的距离document的高度,而不是当前鼠标点击的地方距离document的高度,或者其他。

所以我就在得到y之前去判断box.top是否>0,然后将其等于0。然而并没有效果。即:box.top= box.top<0 ? 0 : box.top;

不行我就直接在y=box.top + pos.y 这改, y = (parseInt(box.top) < 0 ? 0 : box.top) +pos.y;

这个bug解决了,但不知道哪里会出现问题。所以 改的时候 请多测测。反正 我是没找到有问题的地方,有的话,记得提醒哦。谢谢。

以上所述就是本文的全部内容了,希望能给有相同需求的小伙伴们一些帮助。

Javascript 相关文章推荐
Jquery工作常用实例 使用AJAX使网页进行异步更新
Jul 26 Javascript
JQuery查找DOM节点的方法
Jun 11 Javascript
js+css实现文字散开重组动画特效代码分享
Aug 21 Javascript
javascript倒计时效果实现
Nov 12 Javascript
javascript实现数字配对游戏的实例讲解
Dec 14 Javascript
浅析java线程中断的办法
Jul 29 Javascript
springMvc 前端用json的方式向后台传递对象数组方法
Aug 07 Javascript
Angular7.2.7路由使用初体验
Mar 01 Javascript
vue 组件中使用 transition 和 transition-group实现过渡动画
Jul 09 Javascript
js实现搜索提示框效果
Sep 05 Javascript
JS实现密码框效果
Sep 10 Javascript
前端性能优化建议
Sep 17 Javascript
jQuery插件pagewalkthrough实现引导页效果
Jul 05 #Javascript
IE浏览器下PNG相关功能
Jul 05 #Javascript
jQuery的Scrollify插件实现滑动到页面下一节点
Jul 05 #Javascript
javascript实现控制的多级下拉菜单
Jul 05 #Javascript
javascript遇到html5的一些表单属性
Jul 05 #Javascript
浅谈angularJS 作用域
Jul 05 #Javascript
javascript 应用小技巧方法汇总
Jul 05 #Javascript
You might like
PHP经典的给图片加水印程序
2006/12/06 PHP
PHP永久登录、记住我功能实现方法和安全做法
2015/04/27 PHP
Laravel 5.5 的自定义验证对象/类示例代码详解
2017/08/29 PHP
使用PHPStorm+XDebug搭建单步调试环境
2017/11/19 PHP
基于jquery可配置循环左右滚动例子
2011/09/09 Javascript
Jquery插件easyUi表单验证提交(示例代码)
2013/12/30 Javascript
JavaScript中的getDay()方法使用详解
2015/06/09 Javascript
第二篇Bootstrap起步
2016/06/21 Javascript
ionic实现滑动的三种方式
2016/08/27 Javascript
JavaScript实现反转字符串的方法详解
2017/04/27 Javascript
vue实现移动端图片裁剪上传功能
2020/08/18 Javascript
Three.js利用dat.GUI如何简化试验流程详解
2017/09/26 Javascript
原生JS实现顶部导航栏显示按钮+搜索框功能
2019/12/25 Javascript
深入解析Python设计模式编程中建造者模式的使用
2016/03/02 Python
python爬虫实战之爬取京东商城实例教程
2017/04/24 Python
python导出chrome书签到markdown文件的实例代码
2017/12/27 Python
Flask-Mail用法实例分析
2018/07/21 Python
python3+selenium实现qq邮箱登陆并发送邮件功能
2019/01/23 Python
将python文件打包成EXE应用程序的方法
2019/05/22 Python
Python 分发包中添加额外文件的方法
2019/08/16 Python
python实现身份证实名认证的方法实例
2019/11/08 Python
python中random.randint和random.randrange的区别详解
2020/09/20 Python
纯CSS3编写的的精美动画进度条(无flash/无图像/无脚本/附源码)
2013/01/07 HTML / CSS
Html5 localStorage入门教程
2018/04/26 HTML / CSS
前端canvas水印快速制作(附完整代码)
2019/09/19 HTML / CSS
英国知名的护肤彩妆与时尚配饰大型综合零售电商:Unineed
2016/11/21 全球购物
护理专业毕业生推荐信
2013/10/31 职场文书
外语系毕业生自荐信范文
2013/12/16 职场文书
绿化工程实施方案
2014/03/17 职场文书
中国在我心中演讲稿
2014/09/13 职场文书
入伍通知书
2015/04/23 职场文书
观后感格式
2015/06/19 职场文书
2015年暑期社会实践报告
2015/07/13 职场文书
婚礼长辈答谢词
2015/09/29 职场文书
党员干部学法用法心得体会
2016/01/21 职场文书
pdf论文中python画的图Type 3 fonts字体不兼容的解决方案
2021/04/24 Python