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 数据缓存data(name, value)详解及实现
Jan 04 Javascript
js日历功能对象
Jan 12 Javascript
javascript实现根据时间段显示问候语的方法
Jun 18 Javascript
javascript引用类型之时间Date和数组Array
Aug 27 Javascript
JS本地刷新返回上一页代码
Jul 25 Javascript
纯前端JavaScript实现Excel IO案例分享
Aug 26 Javascript
纯原生js实现table表格的增删
Jan 05 Javascript
Angular.JS利用ng-disabled属性和ng-model实现禁用button效果
Apr 05 Javascript
微信小程序 刷新上拉下拉不会断详细介绍
May 11 Javascript
一个简单的node.js界面实现方法
Jun 01 Javascript
谈谈我在vue-cli3中用预渲染遇到的坑
Apr 22 Javascript
微信小程序开发(二):页面跳转并传参操作示例
Jun 01 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
冰滴咖啡制作步骤
2021/03/03 冲泡冲煮
php设计模式 Composite (组合模式)
2011/06/26 PHP
PHP中的错误处理、异常处理机制分析
2012/05/07 PHP
解析php中的escape函数
2013/06/29 PHP
PHP实现ftp上传文件示例
2014/08/21 PHP
php实现根据url自动生成缩略图的方法
2014/09/23 PHP
php调用shell的方法
2014/11/05 PHP
php实现把url转换迅雷thunder资源下载地址的方法
2014/11/07 PHP
Twig模板引擎用法入门教程
2016/01/20 PHP
什么是OneThink oneThink后台添加插件步骤
2016/04/13 PHP
php+js实现的无刷新下载文件功能示例
2019/08/23 PHP
JQuery 绑定事件时传递参数的实现方法
2009/10/13 Javascript
js 屏蔽鼠标右键脚本附破解方法
2009/12/03 Javascript
解析JSON对象与字符串之间的相互转换
2013/12/18 Javascript
jquery获得keycode的示例代码
2013/12/30 Javascript
JS+CSS实现带关闭按钮DIV弹出窗口的方法
2015/02/27 Javascript
javascript 判断页面访问方式电脑或者移动端
2016/09/19 Javascript
JavaScript编写一个贪吃蛇游戏
2017/03/09 Javascript
使用node.js搭建服务器
2017/05/20 Javascript
babel的使用及安装配置教程
2018/02/22 Javascript
解决vue-cli单页面手机应用input点击手机端虚拟键盘弹出盖住input问题
2018/08/25 Javascript
Vue通过Blob对象实现导出Excel功能示例代码
2020/07/31 Javascript
[01:08:00]Fnatic vs Winstrike 2018国际邀请赛小组赛BO2 第一场 8.18
2018/08/19 DOTA
python魔法方法-属性转换和类的表示详解
2016/07/22 Python
Python考拉兹猜想输出序列代码实践
2019/07/05 Python
jupyter notebook更换皮肤主题的实现
2021/01/07 Python
IE矩阵Matrix滤镜旋转与缩放及如何结合transform
2012/11/29 HTML / CSS
使用CSS3的box-sizing属性解决div宽高被内边距撑开的问题
2016/06/28 HTML / CSS
美国翻新电子产品商店:The Store
2019/10/08 全球购物
专科应届毕业生求职信
2014/06/04 职场文书
招商引资工作汇报
2014/10/28 职场文书
基层工作经验证明样本
2014/11/16 职场文书
试用期解除劳动合同通知书
2015/04/16 职场文书
党员干部学习三严三实心得体会
2016/01/05 职场文书
2019年工作总结范文
2019/05/21 职场文书
python保存图片的四个常用方法
2022/02/28 Python