鼠标事件指通过鼠标触发事件, 类似用户的行为:
Onclick：当单击鼠标时运行脚本
Ondblclick：当双击鼠标时运行脚本
Onmousedown:当按下鼠标按钮时运行脚本
onmousemove:当鼠标指针移动时运行脚本
Onmouseout:当鼠标指针移出元素时运行脚本
Onmouseover:当鼠标指针移至元素之上时运行脚本
Onmouseup:当松开鼠标按钮时运行脚本
Onmousewhee;当转动鼠标滚轮时运行脚本
Onscroll:当滚动元素的滚动条时运行脚本
<!DOCTYPE html>
<html lang="en">
<head>
<meta charset="UTF-8">
<meta http-equiv="X-UA-Compatible" content="IE=edge">
<meta name="viewport" content="width=device-width, initial-scale=1.0">
<title>鼠标事件</title>
<style>
div{
width: 200px;
height: 200px;
background-color: blue;
}
</style>
</head>
<body>
<div id="box"></div>
<script>
var box = document.getElementById("box");
//鼠标单击事件
// box.onclick = function(){
// alert(123);
// }
//鼠标双击事件
// box.ondblclick = function(){
// alert(123);
// }
//鼠标移至元素之上 事件
// box.onmouseover = function(){
// console.log("鼠标在元素上面")
// }
//鼠标移出元素 事件
// box.onmouseout = function(){
// alert(456);
// }
//鼠标移动时元素事件
// box.onmousemove = function(){
// console.log("鼠标在移动") ;
// }
// box.onmousedown = function(){
// console.log("当前鼠标为按下状态")
// }
// box.onmouseup = function(){
// console.log("当前鼠标为松开状态")
// }
// box.onmousewheel = function(){
// console.log("当前为滚轮状态")
// }
// window.onscroll = function(){
// alert("滚动条事件");
// }
</script>
</body>
</html>
549
被折叠的 条评论
为什么被折叠?
到【灌水乐园】发言
