如何在mousemove上更改Body背景颜色的一部分？

Question

当你在鼠标移动时为页面着色时，我想做类似于Paint的操作。这就是我先做的事情：

 <script>
    $(document).mousemove(function(event){
    var cordX = event.pageX;
    var cordY = event.pageY;
    $("<div></div>").addClass("circle").appendTo("body").css({'top':cordY,'left':cordX});
    })
   </script>

https://jsfiddle.net/4o1xkp3d/1/

但是用许多<div>向身体发送垃圾邮件并不是一种有效的方法。因此，当我移动鼠标时，我只能为身体背景上的一部分像素着色，我想我可以达到相同的效果。当然，此刻我不知道如何不断将身体背景颜色改为几个相对于鼠标的特定位置的像素大小。有什么想法吗？