使用javascript和css设计鼠标

我想用javascript和HTML5画布测试一些东西，它们看起来真的很让我兴奋。我创建的第一件事是一个非常基本的绘画，你只能放置正方形并设置正方形的颜色、宽度和高度。当您将鼠标悬停在画布上时，我希望它显示您将放置的形状的“预览”，最接近的是：

elem.addEventListener('mousemove', function(event) 
{
    var x = event.pageX - elemLeft, y = event.pageY - elemTop;

    // Render elements.
    elements.forEach(function(element) 
    {
        //Listen for controls.
        var brushHeight = document.getElementById('brushHeight').value;
        var brushWidth = document.getElementById('brushWidth').value;
        var brushColor = document.getElementById('brushColor').value;
        context.fillStyle = brushColor;
        context.fillRect(x, y, brushWidth, brushHeight);
    });
    // Add element.
    elements.push(
    {
        colour: brushColor,
        width: brushWidth,
        height: brushHeight,
    });
}, false);

但这有几个问题，我不知道如何删除“预览”，而不删除下面的东西（之前放置的形状），所以它只是无限地画线。有没有任何可能的方法可以让这段代码成为光标本身？如果没有人知道我如何将上面的代码修复成我想要的样子

我很难用语言表达出来，你需要的任何其他信息请直接询问

---

这是关键：

看看这是否有帮助：只需将其应用于画布元素（

canvas.style.cursor=…

），这正是我想要的！谢谢，我在任何地方都找不到这方面的资料。