Heim  >  Artikel  >  Web-Frontend  >  Verwendung des jQuery EasyUI-Faltpanels

Verwendung des jQuery EasyUI-Faltpanels

php中世界最好的语言
php中世界最好的语言Original
2018-03-15 14:20:342340Durchsuche

Dieses Mal werde ich Ihnen die Verwendung des jQuery EasyUI-Faltpanels vorstellen. Was sind die Vorsichtsmaßnahmen bei der Verwendung des jQuery EasyUI-Faltpanels? .

Der folgende Redakteur wird Ihnen ein Beispiel für die Verwendung des jQuery EasyUI-Faltpanel-Akkordeons vorstellen. Es hat einen guten Referenzwert und ich hoffe, dass es für alle hilfreich ist. Folgen wir dem Editor, um einen Blick darauf zu werfen

1. Legen Sie class="easyui-accordion" für den Faltbereich p fest

2. Fügen Sie dem Bereich mehrere p hinzu, jedes p ist ein Bereich (Jedes Panel muss das Titel--Attribut festlegen).

3. Setzen Sie das Panel-Attribut fit auf true und passen Sie die Größe des übergeordneten Containers an

<!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>

Ich glaube, Sie haben die Methode gemeistert, nachdem Sie den Fall in diesem Artikel gelesen haben Informationen, bitte beachten Sie andere verwandte Themen im Artikel über die chinesische PHP-Website!

Empfohlene Lektüre:

Praktischer Online-Kundenservice im jQuery-Schubladenstil

Ausführliche Erklärung zur Verwendung des Bildbetrachtungs-Plug-Ins Vergrößern

jquery führt Zellen dynamisch zusammen

C3+jQuery zum Erstellen von Animationseffekten und Rückruffunktionen

Das obige ist der detaillierte Inhalt vonVerwendung des jQuery EasyUI-Faltpanels. Für weitere Informationen folgen Sie bitte anderen verwandten Artikeln auf der PHP chinesischen Website!

Stellungnahme:
Der Inhalt dieses Artikels wird freiwillig von Internetnutzern beigesteuert und das Urheberrecht liegt beim ursprünglichen Autor. Diese Website übernimmt keine entsprechende rechtliche Verantwortung. Wenn Sie Inhalte finden, bei denen der Verdacht eines Plagiats oder einer Rechtsverletzung besteht, wenden Sie sich bitte an admin@php.cn