IdentifiantMot de passe
Loading...
Mot de passe oublié ?Je m'inscris ! (gratuit)
Navigation

Inscrivez-vous gratuitement
pour pouvoir participer, suivre les réponses en temps réel, voter pour les messages, poser vos propres questions et recevoir la newsletter

JavaScript Discussion :

personnaliser les check-box


Sujet :

JavaScript

  1. #1
    Membre averti
    Inscrit en
    Mai 2010
    Messages
    23
    Détails du profil
    Informations forums :
    Inscription : Mai 2010
    Messages : 23
    Par défaut personnaliser les check-box
    je veux personnaliser les check box avec des images,
    etat unchecked image A
    etat checked image B

  2. #2
    Rédacteur/Modérateur

    Avatar de SpaceFrog
    Homme Profil pro
    Développeur Web Php Mysql Html Javascript CSS Apache - Intégrateur - Bidouilleur SharePoint
    Inscrit en
    Mars 2002
    Messages
    39 659
    Détails du profil
    Informations personnelles :
    Sexe : Homme
    Âge : 75
    Localisation : Royaume-Uni

    Informations professionnelles :
    Activité : Développeur Web Php Mysql Html Javascript CSS Apache - Intégrateur - Bidouilleur SharePoint
    Secteur : Industrie

    Informations forums :
    Inscription : Mars 2002
    Messages : 39 659
    Billets dans le blog
    1
    Par défaut
    pourquoi ne pas modifier le background-position d'une image qui aurait les deux états du check ?
    Ma page Developpez - Mon Blog Developpez
    Président du CCMPTP (Comité Contre le Mot "Problème" dans les Titres de Posts)
    Deux règles du succès: 1) Ne communiquez jamais à quelqu'un tout votre savoir...
    Votre post est résolu ? Alors n'oubliez pas le Tag

    Venez sur le Chat de Développez !

  3. #3
    Membre averti
    Inscrit en
    Mai 2010
    Messages
    23
    Détails du profil
    Informations forums :
    Inscription : Mai 2010
    Messages : 23
    Par défaut
    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 ">

  4. #4
    Expert éminent

    Homme Profil pro
    Inscrit en
    Janvier 2007
    Messages
    13 474
    Détails du profil
    Informations personnelles :
    Sexe : Homme
    Localisation : France, Isère (Rhône Alpes)

    Informations professionnelles :
    Secteur : Finance

    Informations forums :
    Inscription : Janvier 2007
    Messages : 13 474
    Par défaut
    Bonjour,
    un exemple ici

    A+

  5. #5
    Membre averti
    Inscrit en
    Mai 2010
    Messages
    23
    Détails du profil
    Informations forums :
    Inscription : Mai 2010
    Messages : 23
    Par défaut
    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!!!

  6. #6
    Expert éminent

    Homme Profil pro
    Inscrit en
    Janvier 2007
    Messages
    13 474
    Détails du profil
    Informations personnelles :
    Sexe : Homme
    Localisation : France, Isère (Rhône Alpes)

    Informations professionnelles :
    Secteur : Finance

    Informations forums :
    Inscription : Janvier 2007
    Messages : 13 474
    Par défaut
    Citation Envoyé par walidos21 Voir le message
    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
    Citation Envoyé par walidos21 Voir le message
    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+

  7. #7
    Membre averti
    Inscrit en
    Mai 2010
    Messages
    23
    Détails du profil
    Informations forums :
    Inscription : Mai 2010
    Messages : 23
    Par défaut
    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!!!

  8. #8
    Expert éminent

    Homme Profil pro
    Inscrit en
    Janvier 2007
    Messages
    13 474
    Détails du profil
    Informations personnelles :
    Sexe : Homme
    Localisation : France, Isère (Rhône Alpes)

    Informations professionnelles :
    Secteur : Finance

    Informations forums :
    Inscription : Janvier 2007
    Messages : 13 474
    Par défaut
    Citation Envoyé par walidos21 Voir le message
    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+

  9. #9
    Membre averti
    Inscrit en
    Mai 2010
    Messages
    23
    Détails du profil
    Informations forums :
    Inscription : Mai 2010
    Messages : 23
    Par défaut
    malheureusement j'ai un storyboard a respecter, s'il n y a pas une solution c 'est pas grave!!! merci encore

  10. #10
    Membre Expert
    Profil pro
    Inscrit en
    Mars 2002
    Messages
    1 132
    Détails du profil
    Informations personnelles :
    Âge : 53
    Localisation : France

    Informations forums :
    Inscription : Mars 2002
    Messages : 1 132
    Par défaut
    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.

  11. #11
    Membre averti
    Inscrit en
    Mai 2010
    Messages
    23
    Détails du profil
    Informations forums :
    Inscription : Mai 2010
    Messages : 23
    Par défaut
    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

  12. #12
    Membre Expert
    Profil pro
    Inscrit en
    Mars 2002
    Messages
    1 132
    Détails du profil
    Informations personnelles :
    Âge : 53
    Localisation : France

    Informations forums :
    Inscription : Mars 2002
    Messages : 1 132
    Par défaut
    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.

  13. #13
    Membre averti
    Inscrit en
    Mai 2010
    Messages
    23
    Détails du profil
    Informations forums :
    Inscription : Mai 2010
    Messages : 23
    Par défaut
    ok, merci!!!

+ Répondre à la discussion
Cette discussion est résolue.

Discussions similaires

  1. Avoir des check box pour les parametres d'une requete
    Par smalldragoon dans le forum Requêtes et SQL.
    Réponses: 11
    Dernier message: 14/10/2014, 22h16
  2. Récupérer l'info contenue dans les check box
    Par TopCao dans le forum MATLAB
    Réponses: 6
    Dernier message: 04/03/2010, 17h19
  3. Afficher les images selectionner avec des check box
    Par Imène_23 dans le forum Interfaces Graphiques
    Réponses: 6
    Dernier message: 18/06/2009, 11h42
  4. [WD 11] Question sur les check box
    Par fabpeden dans le forum WinDev
    Réponses: 4
    Dernier message: 19/04/2007, 10h12
  5. cocher tout les check box
    Par Flob dans le forum Balisage (X)HTML et validation W3C
    Réponses: 5
    Dernier message: 17/02/2005, 10h29

Partager

Partager
  • Envoyer la discussion sur Viadeo
  • Envoyer la discussion sur Twitter
  • Envoyer la discussion sur Google
  • Envoyer la discussion sur Facebook
  • Envoyer la discussion sur Digg
  • Envoyer la discussion sur Delicious
  • Envoyer la discussion sur MySpace
  • Envoyer la discussion sur Yahoo