1<style>2 . big{3 /*width:50px;*/4 height:50px;5background-color: #53ff53;6 position:relative;7 }8</style>9<script src= "Jquery/jquery-3.1.0.js" ></script>Ten One<body> A<div class= "Big" ></div> -<script> - //animate () does not support non-numeric attributes, such as the Transform property the //execute in the order of animation - //$ (". Big"). Click (function () { - //$ (this). Animate ({"Left": "500px"},1000). Animate ({"Top": "300px"}) - // }) + - + //when the queue is set to False, the animation does not participate in the animation queue, but instead directly begins execution A //$ (function () { at //$ (". Big"). Animate ({"width": "100px"},2000). Animate ({"Height": "600px"},1000). Animate ({"Left": "300px"},{queue : false,duration:3000}) - // }) - - - //The step option, the callback function called after each animation is executed, receives two parameters now,fx,this is the DOM element that is currently performing the animation - //$ (function () { in //$ (". Big"). Animate ({"Left": "300px"},{step:function (NOW,FX) { - //$ (this). css ({"Left": Now, "transform": "Rotate (30deg)"}); to //},duration:3000} + // ) - // }) the * $ Panax Notoginseng$(function(){ -$ (". Big"). Animate ({"Top": "250px"},{step:function(NOW,FX) { the //Console.log (NOW,FX) + //Now the value of the animation property for each step A //a reference to the FX JQUERY.FX prototype object that contains many properties, Elem represents the currently executing animation, start and end are the first and last values of the animated property, prop the animated property in progress thefx.elem.style.top=Now ; +},duration:3000}) - }) $ $ - -</script>
Jquery-animate ()