东软学习，一个简单的jQuery鼠标滑过div放大缩小_jquery滑轮控制div比例-优快云博客

本文链接：https://blog.youkuaiyun.com/u010095995/article/details/38852739

<!doctype html>
<html lang="en">

 <head>
  <meta charset="UTF-8">
  <meta name="Generator" content="EditPlus®">
  <title>Document</title>
  <script type="text/javascript" src="js/jquery.js"></script>
  <script type = "text/javascript">
		$(document).ready(
		function()
		{
			$("#box").mouseout(
				function()
				{
					$("#box").animate({height:"100px"});
				}
			);
			$("#box").mouseover(
				function(){
					$("#box").animate({height:"300px"});
				}
			);
			$("#box1").mouseout(
				function()
				{
					$("#box1").animate({height:"100px"});
				}
			);
			$("#box1").mouseover(
				function(){
					$("#box1").animate({height:"300px"});
				}
			);
		}
	)
  </script>
 </head>
 <body>
	<div id="box" style="background:#98bf21;height:100px;width:100px; float:left"></div>
	<div id="box1" style="background:#98bf21;height:100px;width:100px;margin-left:100px;margin-top:10px;"></div>
 </body>
</html>

 <img src="https://img-blog.youkuaiyun.com/20140826203008629?watermark/2/text/aHR0cDovL2Jsb2cuY3Nkbi5uZXQvdTAxMDA5NTk5NQ==/font/5a6L5L2T/fontsize/400/fill/I0JBQkFCMA==/dissolve/70/gravity/Center" alt="" />