<!DOCTYPE html><html lang="en"><head><meta charset="utf-8"><title>jQuery UI Accordion - Collapse content</title><link rel="stylesheet" href="../../themes/base/jquery.ui.all.css"><script src="../../jquery-1.7.1.js"></script><script src="../../ui/jquery.ui.core.js"></script><script src="../../ui/jquery.ui.widget.js"></script><script src="../../ui/jquery.ui.accordion.js"></script><link rel="stylesheet" href="../demos.css"><script>//collapsible: true不設這個屬性的話，預設總會有一個展開；//設為true就可以全部摺疊起來$(function() {$( "#accordion" ).accordion({collapsible: true});});</script></head><body> <div class="demo"> <div id="accordion"><h3><a href="#">第1個菜單 1</a></h3><div><p>第1個菜單 1的內容</p></div><h3><a href="#">第2個菜單 2</a></h3><div><p>第2個菜單 2的內容 </p></div><h3><a href="#">第3個菜單 3</a></h3><div><p>第3個菜單 3的內容 </p><ul><li>List item one</li><li>List item two</li><li>List item three</li></ul></div><h3><a href="#">第4個菜單 4</a></h3><div><p>第4個菜單 4的內容</p></div></div> </div><!-- End demo --> <div class="demo-description"><p>By default, accordions always keep one section open. To allow for all sections to be be collapsible, set the <code>collapsible</code> option to true. Click on the currently open section to collapse its content pane.</p></div><!-- End demo-description --> </body></html>
Start building with 50+ products and up to 12 months usage for Elastic Compute Service
1 on 1 presale consultation
24/7 Technical Support 6 Free Tickets per Quarter Faster Response
Alibaba Cloud offers highly flexible support services tailored to meet your exact needs.
A comprehensive suite of global cloud computing services to power your business
Payment Methods We Support
