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 相关文章推荐
javascript 系统文件夹文件操作及参数介绍
Jan 08 Javascript
javascript将数组插入到另一个数组中的代码
Jan 10 Javascript
jQuery插件jQuery-JSONP开发ajax调用使用注意事项
Nov 22 Javascript
drag-and-drop实现图片浏览器预览
Aug 06 Javascript
js实现数组冒泡排序、快速排序原理
Mar 08 Javascript
浅谈Javascript中的函数、this以及原型
Oct 09 Javascript
footer定位页面底部(代码分享)
Mar 07 Javascript
Vuejs入门教程之Vue生命周期,数据,手动挂载,指令,过滤器
Apr 19 Javascript
vue实现登录后页面跳转到之前页面
Jan 07 Javascript
基于Vue、Vuex、Vue-router实现的购物商城(原生切换动画)效果
Jan 09 Javascript
VeeValidate在vue项目里表单校验应用案例
May 09 Javascript
Angular 多模块项目构建过程
Feb 13 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 daddslashes 使用方法介绍
2012/10/26 PHP
作为程序员必知的16个最佳PHP库
2015/12/09 PHP
深入理解PHP中mt_rand()随机数的安全
2017/10/12 PHP
PHP获取文件扩展名的常用方法小结【五种方式】
2018/04/27 PHP
根据json字符串生成Html的一种方式
2013/01/09 Javascript
jQuery制作的别致导航有阴影背景高亮模式窗口
2014/04/15 Javascript
JS小游戏之宇宙战机源码详解
2014/09/25 Javascript
JavaScript italics方法入门实例(把字符串显示为斜体)
2014/10/17 Javascript
jQuery通过Ajax返回JSON数据
2015/04/28 Javascript
编写高性能Javascript代码的N条建议
2015/10/12 Javascript
基于html5和nodejs相结合实现websocket即使通讯
2015/11/19 NodeJs
JavaScript 栈的详解及实例代码
2017/01/22 Javascript
HTML中使背景图片自适应浏览器大小实例详解
2017/04/06 Javascript
knockoutjs模板实现树形结构列表
2017/07/31 Javascript
Angularjs自定义指令实现分页插件(DEMO)
2017/09/16 Javascript
JS实现的类似微信聊天效果示例
2019/01/29 Javascript
vue.js实现二级菜单效果
2019/10/19 Javascript
vue中echarts引入中国地图的案例
2020/07/28 Javascript
Python模块学习 filecmp 文件比较
2012/08/27 Python
在GitHub Pages上使用Pelican搭建博客的教程
2015/04/25 Python
Python基于回溯法子集树模板实现8皇后问题
2017/09/01 Python
scrapy爬虫完整实例
2018/01/25 Python
用python 实现在不确定行数情况下多行输入方法
2019/01/28 Python
Python小进度条显示代码
2019/03/05 Python
HTML5之SVG 2D入门3—文本与图像及渲染文本介绍
2013/01/30 HTML / CSS
移动端html5判断是否滚动到底部并且下拉加载
2019/11/19 HTML / CSS
亚洲最大的眼镜批发商和零售商之一:Glasseslit
2018/10/08 全球购物
牵手50台湾:专为黄金岁月的单身人士而设的交友网站
2021/02/18 全球购物
三年级语文教学反思
2014/02/01 职场文书
银行竞聘演讲稿范文
2014/04/23 职场文书
统计学教授推荐信
2014/09/18 职场文书
软件研发工程师岗位职责
2014/09/30 职场文书
2014年工作总结与下年工作计划
2014/11/27 职场文书
营销计划书范文
2015/01/17 职场文书
校长师德表现自我评价
2015/03/05 职场文书
Spring Data JPA的Audit功能审计数据库的变更
2021/06/26 Java/Android