22-鼠标事件

选择背景色：黄橙洋红淡粉水蓝草绿白色选择字体：宋体黑体微软雅黑楷体选择字体大小：小中大特恢复默认

由于要创建函数来处理鼠标与自定义画布音频控件之间的交互，因此需要为某些常见的鼠标事件添加事件处理函数。

首先，创建一对变量mouseX和mouseY来保存当前鼠标指针的x轴和y轴位置。

var mouseX;
var mouseY;

接下来，创建事件处理函数。首先，监听mouseup事件。当用户停止按住鼠标按钮时会触发此事件。当试图确认是否应该停止拖动音量滑块时，监听这个事件。

theCanvas.addEventListener("mouseup",eventMouseUp, false);

还需要监听mousedown事件，以确认是否按下播放/暂停按钮和是否按下循环开/关切换按钮。在单击音量滑块时，可以开始拖动它。

theCanvas.addEventListener("mousedown",eventMouseDown, false);

最后，监听mousemove事件，这样就可以计算出当前的鼠标指针x轴和y轴的位置。使用这个值来确认是否按下按钮，以及是否单击或拖动音量滑块。

theCanvas.addEventListener("mousemove",eventMouseMove, false);