jquery 做一个收起和展开的动画 slideToggle

最新推荐文章于 2024-07-11 11:41:59 发布

三尺秋水一点飞鸿

最新推荐文章于 2024-07-11 11:41:59 发布

阅读量2.1k

点赞数

分类专栏： js jQuery 笔记

本文链接：https://blog.csdn.net/qq_42467563/article/details/83351917

版权

这篇博客介绍如何使用jQuery的slideToggle方法创建一个收起和展开的动画效果。通过点击按钮，一个蓝色背景的div会以2秒的动画效果隐藏或显示，同时按钮文字会在"展开"和"收起"之间切换，提供友好的用户体验。

摘要由CSDN通过智能技术生成

<!DOCTYPE html>
<html>
   <head>
       <meta charset="UTF-8">
       <title></title>
       <style>

           #one{
               width: 500px;
               height: 200px;
               background: yellow;
           }
           #two{
               width: 500px;
               height: 200px;
               background:dodgerblue;
               position: absolute;
               display: none;
           }

       </style>
   </head>
   <body>
       <button id="clab" type="button" οnclick="myFunction()">展开</button>
       <div id="one">我交钱了优先展示</div>
       <div id="two">我要滑动隐藏</div>
   </bo