jQuery animate()

jQuery animate()方法为您提供了一种创建自定义动画的方法。

句法：

$(selector).animate({params}, speed, callback);

在这里，params参数定义了要动画的CSS属性。

speed参数是可选的，它指定效果的持续时间。可以将其设置为“慢”，“快”或毫秒。

callback参数也是可选的，它是在动画完成后执行的函数。

让我们以一个简单的示例来看动画效果。

 


Start Animation
A simple animation example:

输出：
Start Animation

A simple animation example:

注意：所有HTML元素的默认位置都是静态的。如果要操纵它们的位置，请将CSS position属性设置为元素的相对，固定或绝对。

jQuery animate()方法使用多个属性

您可以使用多个属性同时设置动画。

 


Start Animation

输出：
Start Animation

jQuery animate()方法使用相对值

您还可以通过在值前面加上+ =或-=来定义相对值(相对于元素的当前值)。

 


Start Animation


 

输出：
Start Animation

使用预定义值的jQuery animate()方法

您还可以将属性的动画值指定为“ show”，“ hide”或“ toggle”。

在此示例中，我们使用“ toggle”值表示高度，这表示它将显示/隐藏所选元素。

 


Start Animation

输出：
Start Animation

jQuery Color动画

您还可以为颜色之间的元素设置动画。

  
  
  
  
  
  
  



  

    
Animate
    
Javatpoint.com is the best tutorial website to learn Java and other programming languages.
  

 Toggle Effect