Jquery的鼠标事件

下面的是我根据https://www.w3school/jquery/event_mouseout.asp,然后自己写的一个小总结的代码。

<!DOCTYPE html>
<html>
	<head>
		<meta charset="utf-8">
		<title></title>
		<script type="text/javascript" src="./js/jquery.min.js"></script>
	</head>
	<body>
		<div id="one" style="width: 50px; float: left;">
			<p>背景色</p>
		</div>
		<div id="two" style="width: 50px; float: left; margin: 16px 10px;">
			<span>背景色</span>
		</div>
		<script type="text/javascript">
			// 鼠标移入事件
			$("p").mouseover(function(){
				$("p").css("background-color","#00ffff");
			});
			// 鼠标移出事件
			$("#one p").mouseout(function(){
				$(this).css("background-color","#E9E9E4");
			});
			
			// 鼠标移入事件
			$("#two").mouseover(function(){
				$(this).css("background-color","#00ffff");
			});
			// 鼠标移出事件
			var two=$("#two");
			two.mouseout(function(){
				two.css("background-color","#E9E9E4");
			});
		</script>
	</body>
</html>

更多推荐

Jquery的鼠标移入移出事件