首页 前端知识 jq动画函数:show()、hide()、toggle()、slideDown()、slideUp()、slideToggle()、fadeIn ()、fadeOut ()、fadeToggle ()

jq动画函数:show()、hide()、toggle()、slideDown()、slideUp()、slideToggle()、fadeIn ()、fadeOut ()、fadeToggle ()

2024-04-13 09:04:57 前端知识 前端哥 441 891 我要收藏
  • jq动画分为:基本动画和综合动画;
  • 基本动画的作用都是显示隐藏;
  • 综合动画是将自定义的属性放进去设置;
  • 基本动画分为:
  • show()、hide()、toggle():相对于左上角显示隐藏;
  • slideDown()、slideUp()、slideToggle():在高度上显示隐藏;
  • fadeIn()、fadeOut()、fadeToggle():是关于透明度上的显示隐藏;
  • 基本动画的参数:
  • 一共三个参数:(动画执行事件,动画效果,动画执行完以后回调函数);
  • 动画效果有两种:
  • swing(默认)、linear(匀速)
  • 综合动画指的是:animate()

1、基本动画介绍:

  • show()、hide()、toggle() :控制高度、宽度和透明度的变化;
  • show()作用:从左上角沿着对角线显示;
  • hide()作用:沿着对角线往左上角隐藏;
  • toggle()作用:是切换的作用,如果属性在显示着,就让它隐藏;如果在隐藏着,就让它显示;
<script>
        $("#myshow").click(function(){
            $("#box").show(1000,"linear",()=>{
                console.log("显示完成")
            })
        })
        $("#myhide").click(function(){
            $("#box").hide(1000,"linear",()=>{
                console.log("隐藏完成&#
转载请注明出处或者链接地址:https://www.qianduange.cn//article/4820.html
标签
css动画
评论
发布的文章
大家推荐的文章
会员中心 联系我 留言建议 回顶部
复制成功!