Fenêtre jQuery EasyUI -Fenêtre et mise en page

Le composant Layout peut être intégré dans une fenêtre. Nous pouvons créer une fenêtre de mise en page complexe sans même écrire de code JavaScript. Le framework jQuery EasyUI gère le rendu et le redimensionnement en arrière-plan pour nous.

À titre d'exemple, nous créons une fenêtre qui contient deux parties, une placée à gauche et une placée à droite. Sur le côté gauche de la fenêtre, nous créons un arbre ; sur le côté droit de la fenêtre, nous créons un conteneur d'onglets.

    <div class="easyui-window" title="Layout Window" icon="icon-help" style="width:500px;height:250px;padding:5px;background: #FAFAFA;">
        <div class="easyui-layout" fit="true">
            <div region="west" split="true" style="width:120px;">
                <ul class="easyui-tree">
                    <li>
                        <span>Library</span>
                        <ul>
                            <li><span>easyui</span></li>
                            <li><span>Music</span></li>
                            <li><span>Picture</span></li>
                            <li><span>Database</span></li>
                        </ul>
                    </li>
                </ul>
            </div>
            <div region="center" border="false" border="false">
                <div class="easyui-tabs" fit="true">
                    <div title="Home" style="padding:10px;">
                        jQuery easyui framework help you build your web page easily.
                    </div>
                    <div title="Contacts">
                        No contact data.
                    </div>
                </div>
            </div>
            <div region="south" border="false" style="text-align:right;height:30px;line-height:30px;">
                <a class="easyui-linkbutton" icon="icon-ok" href="#">Ok</a>
                <a class="easyui-linkbutton" icon="icon-cancel" href="#">Cancel</a>
            </div>
        </div>
    </div>

Regardez le code ci-dessus — nous n'avons utilisé que du balisage HTML, et une fenêtre de mise en page complexe s'affichera. C'est le framework jQuery EasyUI : simple et puissant.

Télécharger les exemples jQuery EasyUI

jeasyui-win-win3.zip