jQuery animate多重动画

最新推荐文章于 2023-12-27 15:11:28 发布

Mogul1

最新推荐文章于 2023-12-27 15:11:28 发布

阅读量964

点赞数

本文链接：https://blog.csdn.net/Mogul1/article/details/80963104

版权

head>
<meta http-equiv="Content-Type" content="text/html; charset=utf-8"/>
    <title></title>
    <style>
      #pale1 {
            width:150px;
            height:150px;
            position:relative;
            background-color:aqua;
        }
      #pale2 {
            width:150px;
            height:150px;
            position:relative;
            background-color:red;
        }

    </style>
	<meta charset="utf-8" />
    <script src="../Scripts/jquery-1.11.3.js"></script>
    <script>
        $(function () {
            $("#pale1").click(function () {
                //先向右并变高
                $(this).animate({ left: "500px", height: "300px" }, 3000)
            });
       
         $(function () {
            $("#pale2").click(function () {
               //先向右再变高
                $(this).animate({ left: "500px" }, 3000).animate({ height: "300px" }, 3000);
            });
        });
     </script>
</head>
<body>
  <div id="pale1"></div>
  <div id="pale2"></div>
</body>