jQuery系列之动画(三)

来源:互联网 发布:冯提莫用什么软件唱歌 编辑:程序博客网 时间:2024/05/16 11:20
<!DOCTYPE html><html lang="en"><head>    <meta charset="UTF-8">    <title>演示动画</title>    <style type="text/css">        * {            font-size: 30px;        }    </style>    <script type="text/javascript" src="jquery-3.2.1.js"></script>    <script type="text/javascript">        $(document).ready(function () {            //渐入渐出            $("span").click(function () {                $(this).fadeOut();            });            $(".toFadeBtn").click(function () {                //如果显示,则隐藏                //如果隐藏,则显示                $("span").toggle();            });            $(".toSlideUpBtn").click(function () {                $("span").slideUp();            });            $(".toSlideDownBtn").click(function () {                $("span").slideDown();            });            //透明度的变化            $(".alpha").click(function () {               $("span").fadeTo(5000,"0.1", function () {                   alert("哈哈哈");               })            }).fadeTo(6000,"0")        });    </script></head><body><span>1</span><br/><span>2</span><br/><span>?</span><br/><span>6</span><br/><span>18</span><br/><button class="toFadeBtn">显示一些</button><button class="toSlideUpBtn">从上面滑走了</button><button class="toSlideDownBtn">从下面滑出来</button><button class="alpha">透明度</button></body></html>
阅读全文
0 0
原创粉丝点击