Discussion :

[walidos21]

je veux personnaliser les check box avec des images,
etat unchecked image A
etat checked image B

[SpaceFrog]

pourquoi ne pas modifier le background-position d'une image qui aurait les deux états du check ?

[walidos21]

t'as pas un exemple parce que je vois pas se que tu veux dire!merci

Code :

Sélectionner tout - Visualiser dans une fenêtre à part

1
2
<input type="checkbox" id="" name=ckbox ')">	
<input type="checkbox" id="" name=ckbox ">

[E.Bzz]

Bonjour,
un exemple ici

A+

[walidos21]

bonjour,

merci pour l'exemple, mais je travaille pas vraiment dans le dev Web, donc le hover ne marche pas sur mon simulateur blackberry, c'est pareil que cet exemple mais je voudrai quelque chose plus simple et plus performant http://lipidity.com/fancy-form/#example

merci!!!

[E.Bzz]

le hover ne marche pas sur mon simulateur blackberry

Il n'est pas question de hover
Je t'ai donné ce lien pour illustrer la solution de SpaceFrog ci-dessus : l'utilisation du background pour afficher 2 images différentes juste en modifiant sa position. Pour toi ça sera bien sûr onclick

mais je voudrai quelque chose plus simple et plus performant

Plus simple j'ai du mal à voir, et performant ...

EDIT : pour info, le lien que tu donnes en exemple utilise le même principe (image en background), sauf qu'il remplace une image par une autre lors du click. Ce qui est moins simple et moins performant

A+

[walidos21]

oui je suis d'accord avec vous mais pour cette exemple, le fichier javascript est nécessaire pour que ça marche mais moi je ne veux pas charger mon application avec trop de fichiers!!!c'est pour cela que je demande s'il y a un autre exemple plus simple merci!!!

[E.Bzz]

je ne veux pas charger mon application avec trop de fichiers!!!

Chaque image que tu veux utiliser ici sera plus lourdes que le moindre .js ou .css
utilise les checkbox par défaut c'est le plus simple, le plus léger et le plus efficace ...

A+

[walidos21]

malheureusement j'ai un storyboard a respecter, s'il n y a pas une solution c 'est pas grave!!! merci encore

[devyan]

Bonjour,

Il y a une solution... celle expliquée plus haut

Je vais donc récapituler :
¤ Tu veux changer l'aspect d'un input type=checkbox pour mettre un joli dessin à la place de la case à cocher standard ?
- Il faut donc ajouter du script pour :
a) initialiser l'image de départ à moins que tu ais généré directement le html côté serveur.
b) lors du click sur la case à cocher il faut changer l'image

Remaque : c'est exactement ce que fait le script que tu as fourni en exemple.

¤ Il faut que ce soit plus simple et plus performant que l'exemple que tu donne ?
- Le script du lien automatise l'initialisation de tous les éléments de formulaire dans la page mais cela peut être réalisé à la construction de lapage html côté serveur. Il ne restera plus qu'à gérer le basculement de l'image en javascript lors du click
- La méthode dite des sprites qui t'a été proposée est plus performante car fonctionne à partir d'une seule image pour gérer les différents états de la case à cocher.

En conclusion, à moins que tu n'attendes que l'on te fournisse directement le code à copier/coller pour que cela fonctionne tu as tout ce qu'il faut

Y.

[walidos21]

j'ai déjà fais ça sur l'exemple que j'ai donné, ma question est de savoir est ce qu'il y a une autre solution plus simple c'est tout, merci

[devyan]

Personnellement je ne vois pas plus simple (et qui fonctionne quel que soit le navigateur).

peut te dire que les différentes solutions disponibles sont assez proches les unes des autres.

Y.

[walidos21]

ok, merci!!!