本文介绍了一个使用HTML、CSS和JavaScript实现的功能，当鼠标按下并在页面上移动时，会在鼠标位置创建并显示一个小圆点。该圆点随着鼠标的移动而改变位置，直至鼠标释放停止移动。
<!DOCTYPE html>
<html>
<head>
<meta charset="UTF-8">
<title></title>
</head>
<style type="text/css">
.active{
width: 10px;
height: 10px;
position: absolute;
border-radius: 50%;
}
</style>
<body>
</body>
</html>
<script src="public.js">
</script>
<script>
/*
涉及的事件 ：
onmousedown
onmousemove ： 创建div 并设置div的位置 为鼠标当前位置
onmouseup ： 取消移动
*/
document.onmousedown = function(e){
e.preventDefault();
document.onmousemove = function(e){
var e = e || event;
var oDiv = create("div");
oDiv.className = "active";
document.body.appendChild(oDiv);
oDiv.style.backgroundColor = getColor();
oDiv.style.left = e.pageX + "px";
oDiv.style.top = e.pageY + "px";
}
document.onmouseup = function(){
document.onmousemove = null;//取消移动
}
//return false;
}
</script>
扫一扫
被折叠的 条评论
为什么被折叠?
到【灌水乐园】发言
