JS mousemove事件监听问题？

Question

<div class="colorPanel">    <div class="selector"><span></span></div>    <div class="bg bg1"></div>    <div class="bg bg2"></div></div>这是结构代码$(document).ready(function () {    var eventCrit = false;    var colorPanel = $('div.colorPanel');    colorPanel.mousedown(function(e) {        eventCrit = true;        handleMousemove(event, colorPanel);    });    $(document).mousemove(function(e) {        if(!eventCrit) return;            handleMousemove(event, colorPanel);    });    colorPanel.mouseup(function(e) {        eventCrit = false;    });    });var handleMousemove = function (event, element) {    event.preventDefault();    var leftValue = (event.offsetX / element.width()) * 100 + '%';    var topValue = (event.offsetY / element.height()) * 100 + '%';    var selector = $('.selector');    console.log(leftValue, topValue);    selector.css({left: leftValue, top: topValue});}这是一个调色板的Demo，在鼠标移动的时候，出现了不正常的值：我确定我移动的方向无错误，但是在第四行和倒数第三行出现了不正常的数值，是我的代码问题吗？在百度、Google、问人后无果，请大神解惑，感激。

Answer 1

把 element.width() 和 element.height() 提前保存起来看看

Answer 2

遇到这种问题，你自己在打印的时候详细一点，把计算该数值的每一项都打印一下，找到是哪项不一样了再去找为什么，现有的代码也看不出啥~~