1 360(7.1.1.620,内核:31.0.1650.63)的极速模式下,出现裁剪框后,鼠标点击,页面就会滑动到底部。
查看了下源码,发现是下面的代码:
function watchKeys() //{{{ { if (options.keySupport) { $keymgr.show(); $keymgr.focus(); } }
触发focus的时候,就会滑动到页面底部。
具体原因是:$keymgr对象就是一个位于页面底部的隐藏的input对象,所以,focus的时候,页面就会滑动到底部。
解决方法:可通过把keySupport设置为false,来避免触发该input对象的focus事件。
我实例化的代码如下所示:
var jcropObj = {}; $('#jcrop_div_id').Jcrop({ onChange : this.showPreview, onSelect : this.showPreview, aspectRatio : 1, /* * 下面的参数,防止360(7.1.1.620,内核:31.0.1650.63)的极速模式下,鼠标点击后,会滑动到页面底部的bug。 * 具体 就是,keySupport默认为true,在源码中有watchKeys函数的$keymgr.focus()代码。 * 因为jcrop-holder的div下有一个位于页面底部的隐藏的input,当鼠标点击的时候,该input就会focus,所以页面就会滑动到底部了。 */ keySupport : false }, function() { //获取jcrop对象,以便保存成功之后的相关操作 jcropObj.jcropDistance_v1 = this; //初始 选框的位置和大小(创建选框,参数格式为:[x, y, x2, y2])//165=210/2+60 110=180/2+20 jcropObj.jcropDistance_v1.setSelect([60, 20, 165, 110]); });