jQuery手風琴是一種常見的動態效果，可以輕松實現展開和關閉效果，讓用戶更加方便地瀏覽網頁內容。下面簡單介紹一下如何使用jQuery手風琴來實現這種效果。
<html>
<head>
<script src="https://cdn.bootcdn.net/ajax/libs/jquery/3.5.1/jquery.min.js"></script>
<link rel="stylesheet" />
<script src="https://cdn.bootcdn.net/ajax/libs/jqueryui/1.12.1/jquery-ui.min.js"></script>
</head>
<body>
<div id="accordion">
<h3>第一節</h3>
<div>
<p>這是第一節內容。</p>
</div>
<h3>第二節</h3>
<div>
<p>這是第二節內容。</p>
</div>
<h3>第三節</h3>
<div>
<p>這是第三節內容。</p>
</div>
</div>
<script>
$(function() {
$("#accordion").accordion();
});
</script>
</body>
</html>首先要引入jQuery庫和jQuery UI庫的文件，這里我們可以使用在線CDN。然后我們需要在頁面中定義一個div元素，設置其id為"accordion"，然后在該元素內部添加多個h3和div標簽，每個h3標簽表示一個section，div標簽中的內容表示該section的具體內容。
最后，我們使用jQuery的accordion()方法來實現手風琴效果。該方法會自動將div元素轉換成手風琴，這樣用戶就可以通過點擊h3標簽來展開或關閉相應的div內容。
上一篇jquery 打印
下一篇jquery 打開 編輯