Étapes détaillées de l'accordéon du panneau pliant pour l'opération jQuery EasyUI-js tutoriel-php.cn

Étapes détaillées de l'accordéon du panneau pliant pour l'opération jQuery EasyUI

php中世界最好的语言

Libérer： 2018-04-19 14:03:34

original

2282 Les gens l'ont consulté

Cette fois, je vais vous apporter les étapes détaillées de jQuery EasyUI faisant fonctionner l'accordéon à panneau pliant, quelles sont les précautions pour jQuery EasyUI faisant fonctionner l'accordéon à panneau pliant, ce qui suit est un cas pratique , jetons un coup d'œil ensemble Jetez un œil.

1. Définissez class="easyui-accordion" pour la zone du panneau pliant p

2. Ajoutez plusieurs p dans la zone, chaque p est un panneau (chaque panneau doit définir l'attribut titre ).

3. Définissez l'attribut du panneau fit sur true et adaptez la taille du conteneur parent

<!DOCTYPE html>
<html>
  <head>
    <meta charset="UTF-8">
    <title>easyui-折叠面板accordion的使用</title>
    <!-- 导入jquery核心类库 -->
    <script type="text/javascript" src="../js/jquery-1.8.3.js"></script>
    <!-- 导入easyui类库 -->
    <link id="easyuiTheme" rel="stylesheet" type="text/css" href="../js/easyui/themes/default/easyui.css">
    <link rel="stylesheet" type="text/css" href="../js/easyui/themes/icon.css">
    <link rel="stylesheet" type="text/css" href="../css/default.css">
    <script type="text/javascript" src="../js/easyui/jquery.easyui.min.js"></script>
  </head>
  <body class="easyui-layout">
    <p data-options="region:&#39;north&#39;,title:&#39;你我他学习吧-学习Java的好博客！&#39;" style="height:100px"></p>
    <p data-options="region:&#39;west&#39;,title:&#39;菜单导航&#39;" style="width:200px">
      <!--折叠面板-->
      <p class="easyui-accordion" data-options="fit:true">
        <p data-options="title:&#39;基础菜单&#39;">面板一</p>
        <p data-options="title:&#39;系统菜单&#39;">面板二</p>
      </p>
    </p>
    <p data-options="region:&#39;center&#39;,title:&#39;中部区域&#39;"></p>
    <p data-options="region:&#39;east&#39;,title:&#39;东部区域&#39;" style="width:100px"></p>
    <p data-options="region:&#39;south&#39;,title:&#39;南部区域&#39;" style="height:100px"></p>
  </body>
</html>

Copier après la connexion

Je pense que vous maîtrisez la méthode après avoir lu le cas dans cet article. Pour des informations plus intéressantes, veuillez prêter attention à. d'autres articles connexes sur le site PHP chinois !

Lecture recommandée :

Explication détaillée de l'utilisation du composant jquery.picsign

Explication détaillée des étapes d'ajout affectations aux éléments enfants avec jQuery

Ce qui précède est le contenu détaillé de. pour plus d'informations, suivez d'autres articles connexes sur le site Web de PHP en chinois!