我有如下鼠标Y位置，然后填充所述脚本宽度a的<canvas>矩形作为鼠标向下移动。
换句话说：鼠标越低-画布的彩色区域就越大，反之亦然。
现在的问题是画布仅填充，并且如果向上移动鼠标，则填充的区域将保持不变，而不是缩小。
提前致谢！
这是因为“画布”从字面上看就像画布。
您的脚本将线条涂成绿色。它无法取消画线。您将需要具有一个相等的相反功能，该功能不断从另一侧填充红色线条。
您可以在不使用Canvas的情况下更轻松地实现这一目标。
$(document).mousemove(function(e){
var mouseY = e.pageY;
$('.fill').width(mouseY);
});
参见示例JSFIDDLE
您也可以像这样轻松地使X和Y都显示出来：
$(document).mousemove(function(e){
var mouseY = e.pageY;
var mouseX = e.pageX;
$('.fillY').width(mouseY);
$('.fillX').width(mouseX);
});
请参见示例JSFIDDLE
本文收集自互联网，转载请注明来源。
如有侵权，请联系 [email protected] 删除。
我来说两句