developer.jelix.org n'est plus utilisée, et existe uniquement pour son historique. Postez les nouveaux tickets sur le compte github.
Version 10 (modified by Lipki, 13 years ago) (diff) |
---|
Proposition pour jImage2 le plugin
{image 'data/fichiers/toupie.png', ' border-radius : 5° ; // avec ou sans le ° border-width : 2px ; // avec ou sans le px border-color : #f00 || #ff0000 ; // 3 ou 6 border-8share : url(border.png) 5px ; // [▲►▼◄] || [▲▼] [►◄] || [▲] [►◄] [▼] || [▲] [►] [▼] [◄] border : 5° 2px #f00; // ° et px requis ; ordre aléatoire ; n'intègre pas 8share square : on ; // [on|off] ; force l'interprétation rectangulaire de l'image, pour les fonds transparent, activer par défaut pour le jpg shadow-offset : 10px ; // avec ou sans le px shadow-angle : 45° ; // avec ou sans le ° ; [0-360] shadow-alpha : 0.5@ ; // avec ou sans le @ ; [0-1] shadow-blur : 5 ; // [1-10] shadow-color : #f00 || #ff0000 ; // 3 ou 6 shadow : on ; // on ou off ; inutile si un autre paramêtre et spécifier shadow : 10px 45° 5 #f00 ; // ° et px requis ; ordre aléatoire rotate : 20° ; // avec ou sans le ° ; [0-360] zoom : 50% ; // avec ou sans le % ; [0-∞] link : url(http://jelix.org) ; vertical-align : top || -20px ; // avec ou sans le px ; [top |middle|bottom|:int] horizontal-align : right || 20px ; // avec ou sans le px ; [left|center|right |:int] align : top 20px ; // avec ou sans le px ; vertical horizontal extension : jpg ; // [png|jpg|gif] quality : 0.8 ; // [0-1] background-color : #f00 || #ff0000 ; // 3 ou 6 background-image : url(border.png) ; background : #f00 url(border.png) ; defaut : url(border.png) || hide ; // [hide|hidden|url(x)] width : 90px || 20% ; // % et px requis ; % de la taille d'origine height : 90px || 20% ; // % et px requis ; % de la taille d'origine enlarge : on ; // [on|off] ratio : inner ; // [inner|outer|inner-cap|outer-cut] class : bob ; // n'importe quel attributs html '}
Comparaison
av : {image 'toupie.png', array('width'=>100) }
ap : {image 'toupie.png', 'width: 100;' }
av : {image 'toupie.png', array('width'=>150, 'height'=>50, 'omo'=>true) }
ap : {image 'toupie.png', 'width: 150; height: 50; ratio: outer-cut;' }
av : {image 'toupie.png', array('width'=>100, 'zoom'=>60, 'alignh'=>'right', 'alignv'=>-20) }
ap : {image 'toupie.png', 'width: 100; zoom: 140; align: -20 right;' }
av : {image 'toupie.png', array('width'=>100, 'shadow'=>true, 'soffset'=>20, 'sangle'=>0, 'sblur'=>0, 'sopacity'=>100, 'scolor'=>'#ffff00') }
ap : {image 'toupie.png', 'width: 100; shadow: 20px 0° 0 1@ #ff0;' }
av : {image 'toupie2.png', array('width'=>100, 'notexists'=>'pastoupie.png') }
ap : {image 'toupie2.png', 'width: 100; defaut: url(pastoupie.png);' }
Utilisation de :
Border
Il est possible d'ajouter une bordure a l'image.
note : si "square" est à off, la bordure devra suivra la forme de l'image. note : l'utilisation de "border-8share" force "square" à on.
- border-radius : Ajoute des coins arrondi a l'image.
- border-width : Épaisseur de la bordure.
- border-color : Couleur de la bordure.
- border-8share : url de l'image utilisé pour créer la bordure, cette image est divisé en 8 part.
Les chiffres représente la taille de la bordure en haut, en bas et sur les coté.
- border : l'ordre de paramètres n'importe pas, mais il faut penser a mettre les unitées.
border-8share n'est pas intégrer.
ex de code :
{image 'toupie2.png', 'border: 5° 3px #fff;' } {image 'toupie2.png', 'border-8share: url(border.png) 5px 3px;' }