j-Columns

Le composant Columns est une alternative très simple à j-Layout et j-Layout2. Avec ce composant, vous pouvez définir des colonnes d'une hauteur de 100 % selon vos besoins.

Configuration :

• parent {String} peut contenir parent, window ou un sélecteur jQuery pour la méthode closest (par défaut : window)
• margin {Number} ajoute une marge à height (par défaut : 0)
• marginlg {Number} ajoute une marge à height pour l'affichage LG (par défaut : margin)
• marginmd {Number} ajoute une marge à height pour l'affichage MD (par défaut : margin)
• marginsm {Number} ajoute une marge à height pour l'affichage SM (par défaut : margin)
• marginxs {Number} ajoute une marge à height pour l'affichage XS (par défaut : margin)
• noborder {Boolean} désactive la bordure (par défaut : false)
• fontsize {Boolean} active la taille de police en pourcentage en fonction de la taille des lignes (par défaut : false)

Méthodes :

• SETTER('columns/refresh') - recharge tous les section et définit les tailles
• SETTER('columns/add', size, html_node) - ajoute une nouvelle colonne et effectue une actualisation

Bon à savoir :

Chaque colonne doit être enveloppée dans <section>, essayez de comprendre à partir de l'exemple.

Attributs :

• data-size contient une taille de section LG,MD,SM,XS --> en pixels ou pourcentage, exemple : 200,200,200,0 (0 signifie caché)
• la section sans attribut data-size sera comptée à partir de la valeur résiduelle

Utilisez-le avec <ui-component name="columns">. Lorsque le composant n'est pas encore chargé, jComponent le télécharge lors de la première utilisation depuis l'adresse dans DEF.fallback (le CDN Componentator par défaut). Auteur : Peter Širka. Source : le référentiel de composants Componentator, licence MIT.

<style>body { padding: 0; margin: 0; }</style>

<ui-component name="columns" config="parent:window" class="hidden invisible">
	<section data-size="200">Left panel</section>
	<section>Main</section>
	<section data-size="200">Right panel</section>
</ui-component>