jQuery EasyUI mise en page - créer une bordure pour la mise en page
mise en page de la frontière (tracé de la frontière) offre cinq régions: est, ouest, nord, sud, centre. Voici quelques usages communs:
- zone située au nord peut être utilisé pour afficher des bannières site.
- zone située au sud peut être utilisé pour afficher les droits d'auteur et des instructions.
- zone à l'ouest peut être utilisé pour afficher le menu de navigation.
- zone à l'est peut être utilisé pour afficher des articles promotionnels.
- zone centrale peut être utilisé pour afficher le contenu principal.
Pour appliquer la mise en page (layout), vous devez déterminer une mise en page (layout) conteneur, puis définir certaines zones. Mise en page (layout) doit exiger au moins une région du centre, ce qui suit est une mise en page (layout) Exemple:
<Div class = le style "easyui-layout" = "width: 400px; height: 200px;">
<Région Div = "ouest" split = "true" title = le style "Navigator" = "width: 150px;">
<P style = "padding: 5px; margin: 0;"> Choisir la langue: </ p>
<Ul>
<Li> <a href="javascript:void(0)" onclick="showcontent('java')"> </ li> </a> Java
<Li> <a href="javascript:void(0)" onclick="showcontent('cshape')"> C # </a> </ li>
<Li> <a href="javascript:void(0)" onclick="showcontent('vb')"> VB </a> </ li>
<Li> <a href="javascript:void(0)" onclick="showcontent('erlang')"> Erlang </a> </ li>
</ Ul>
</ Div>
<Div id = "content" region = "center" title = style "Langue" = "padding: 5px;">
</ Div>
</ Div>
Nous créons un conteneur <div> avec une disposition de la frontière (mise en page de la frontière), la mise en page (layout) du récipient est coupé en deux parties, la gauche est le menu de navigation sur la droite est le contenu principal.
Enfin, nous écrivons un gestionnaire d'événement onclick pour récupérer les données, fonction 'showcontent' est très simple:
fonction showcontent (langue) {
. $ ( '# Content') html ( 'Introduction à' + langue + «langue»);
}