1.效果展示
2.代码展示
<!DOCTYPE html> <html lang="en"> <head> <meta charset="UTF-8"> <meta name="viewport" content="width=device-width, initial-scale=1.0"> <title>动画效果-滑动-效果</title> <script src="./js/jquery.js"></script> <style> .op { height: 20px; 300px; background-color: pink; float: left; } </style> </head> <body> <div class="op">你好啊，都是自己的内容其实都确定东西</div> <input type="button" value="隐藏队列动画" class="hide"> <input type="button" value="展示队列动画" class="show"> </body> </html> <script> $(function(){ $(".hide").click(function(){ $(".op").hide(2000); }) $(".show").click(function(){ $(".op").show(2000); }); }) </script>