• jQuery EasyUI 折叠面板accordion的使用实例


    1、对折叠面板区域 div 设置 class=”easyui-accordion” 
    2、在区域添加多个 div, 每个 div 就是一个面板 (每个面板一定要设置 title 属性)。 
    3、设置面板属性 fit 为 true,自适应父容器大小

     1 <!DOCTYPE html>
     2 <html>
     3     <head>
     4         <meta charset="UTF-8">
     5         <title>easyui-折叠面板accordion的使用</title>
     6         <!-- 导入jquery核心类库 -->
     7         <script type="text/javascript" src="../js/jquery-1.8.3.js"></script>
     8         <!-- 导入easyui类库 -->
     9         <link id="easyuiTheme" rel="stylesheet" type="text/css" href="../js/easyui/themes/default/easyui.css">
    10         <link rel="stylesheet" type="text/css" href="../js/easyui/themes/icon.css">
    11         <link rel="stylesheet" type="text/css" href="../css/default.css">
    12         <script type="text/javascript" src="../js/easyui/jquery.easyui.min.js"></script>
    13     </head>
    14     <body class="easyui-layout">
    15         <div data-options="region:'north',title:'你我他学习吧-学习Java的好博客!'" style="height:100px"></div>
    16         <div data-options="region:'west',title:'菜单导航'" style="200px">
    17             <!--折叠面板-->
    18             <div class="easyui-accordion" data-options="fit:true">
    19                 <div data-options="title:'基础菜单'">面板一</div>
    20                 <div data-options="title:'系统菜单'">面板二</div>
    21             </div>
    22         </div>
    23         <div data-options="region:'center',title:'中部区域'"></div>
    24         <div data-options="region:'east',title:'东部区域'" style="100px"></div>
    25         <div data-options="region:'south',title:'南部区域'" style="height:100px"></div>
    26     </body>
    27 </html>
  • 相关阅读:
    EasyUI combogrid 赋多个值
    EasyUI 打印当前页
    EasyUI 获取行ID,符合条件的添加样式
    JS 调用存储过程传递参数
    彻底解决Request Too Long的问题
    SQL处理XML
    DataTable排序
    EasyUI 动态生成列加分页
    SQL2012 分页(最新)
    计算数据库中各个表的数据量和每行记录所占用空间
  • 原文地址:https://www.cnblogs.com/niwotaxuexiba/p/8098954.html
Copyright © 2020-2023  润新知