18-三组基本动画

<!DOCTYPE html>
<html lang="zh-CN">
<head>
  <meta charset="UTF-8">
  <title>Title</title>
  <style>
    div {
      width: 400px;
      height: 400px;
      background-color: pink;
      display: none;
    }
  </style>
</head>
<body>
<input type="button" value="显示">
<input type="button" value="隐藏">

<div></div>
<script type="text/javascript" src="jquery-1.12.4.js"></script>
<script type="text/javascript">
    
    $(function(){
              //eq(n)  选择下标为N的元素
        $('input').eq(0).click(function(){
            /*
             * speed:速度
             * easing:效果
             * fn:回调函数
             * */
             /*
              * $('div').show(1000,function(){
              })
              * 
              *
              * */
            $('div').show(1000,function(){
                $('div').hide(1000,function(){
                    $('div').show(1000)
                })
            })
        })
        $('input').eq(1).click(function(){
            $('div').hide(1000)
        })
    })
    
</script>
</body>
</html>
最后编辑于
©著作权归作者所有,转载或内容合作请联系作者
【社区内容提示】社区部分内容疑似由AI辅助生成,浏览时请结合常识与多方信息审慎甄别。
平台声明:文章内容(如有图片或视频亦包括在内)由作者上传并发布,文章内容仅代表作者本人观点,简书系信息发布平台,仅提供信息存储服务。

相关阅读更多精彩内容

友情链接更多精彩内容