前端

web前端学习（五）（4）– jQuery隐藏显示与淡入淡出、滑动、回调

云博小周宇1 Min Read

1、隐藏与显示

<!DOCTYPE html>
<html lang="en">
<head>
    <meta charset="UTF-8">
    <title>Title</title>
    <script src="jquery-3.3.1.min.js"></script>
    <script>
        $(document).ready(function(){
            $("#hide").click(function(){
                $("p").hide(1000);/*慢慢隐藏*/
            });
            $("#show").click(function(){
                $("p").show(1000);/*慢慢显示*/
            });
            $("#btn3").click(function(){
                $("p").toggle(1000);/*一个按钮实现隐藏和显示*/
            });
        });
    </script>
</head>
<body>
<p>p元素</p>
<button id="hide">删除</button>
<button id="show">显示</button>
<button id="btn3">隐藏/显示</button>
</body>
</html>

 

 

2、淡入淡出

3、滑动

4、回调