jquery动画思维导图

jQuery有很多方法可以帮助我们在页面上实现很多有趣好玩的动画效果，而且程序代码简单比用原生态的JavaScript代码实现效果更加方便简洁，有效的促进jQuery的学习！

jquery的动画效果

• 隐藏匹配元素
  • hide()方法相当于元素css样式属性display的值设置为none，它会记住原来的display的值。hide()fa方法有两种语法格式：
  • 1：hide()
  • 2:hide(speed,[callback])
• 显示匹配元素
  • show()方法可以显示匹配的元素。show()方法相当于css样式属性display的值设置block或inline或除了none以外的值。它会恢复应用display：none之前的可见属性。两种方式：
  • 1：show()
  • 2：show(speed,[callback]）
• 切换元素的可见状态
  • toggle()方法可以实现切换元素的可见状态，也就是如果元素是可见的，切换为隐藏；如果元素是隐藏的，切换为可见。语法格式：toggle()
• 淡入淡出的动画效果
  • 1: fadeln(speed,[callback])通过增大不透明度实现匹配元素淡入的效果。
  • 2：fadeOut(speed,[callback])通过减小不透明度实现匹配元素淡出的效果。
  • 3：fadeTo(speed,opacity,[callback])将匹配元素的不透明度以渐出的方式调整到指定的参数。
• 滑动效果
  • 滑动显示匹配的元素
    • sideDown()方法(用于滑动显示匹配的元素)
  • 滑动隐藏匹配的元素
    • sildeUp方法(用于滑动隐藏匹配的元素)
  • 通过高度的变化动态切换元素的可见性
    • sideToggle()方法(通过高度的变化动态切换元素的可见性)来实现滑动效果。
• 自定义的动画效果
  • 1： 使用animate()方法创建自定义动画
  • 2：使用shop()方法停止动画
  • 3：延迟动画效果用delay()方法
• 浮动主题