jQuery点击按钮元素移动(动画)

jQuery 点击按钮元素移动(动画)

 
<html lang="en">
<head>
    <meta charset="UTF-8">
    <title>title>
    <style type="text/css">
        .box1{
            width: 100px;
            height: 100px;
            background: pink;
            position: absolute;

        }
        .box2{
            width: 100px;
            height: 100px;
            background: blue;
            position: absolute;
            top: 100px;
            left: 50px;

        }
    style>
    <script type="text/javascript" src="jquery-3.1.1.min.js">   
    script>
    <script type="text/javascript">
        $(document).ready(function(){
            $("button").click(function(){
                // 不同元素的动画同时进行                                                                                                                                
                $(".box1").animate({"left":500,"top":100},3000);
                $(".box2").animate({"left":100,"top":600},3000);
            })
        }) 
    script>
head>
<body>
    <button>按钮button>
    <div class="box1">div>
    <div class="box2">div>
body>
html> 

你可能感兴趣的:(jQuery)