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 :

Comment changer une image en fonction d'une valeur (javascript)


Sujet :

JavaScript

Vue hybride

Message précédent Message précédent   Message suivant Message suivant
  1. #1
    Candidat au Club
    Homme Profil pro
    commerce
    Inscrit en
    Septembre 2016
    Messages
    2
    Détails du profil
    Informations personnelles :
    Sexe : Homme
    Âge : 53
    Localisation : France, Bas Rhin (Alsace)

    Informations professionnelles :
    Activité : commerce
    Secteur : Tourisme - Loisirs

    Informations forums :
    Inscription : Septembre 2016
    Messages : 2
    Par défaut Comment changer une image en fonction d'une valeur (javascript)
    Bonjour ou bonsoir à tous
    je cherche comment changer une image en fonction de la valeur d'un input, c'est à dire que je souhaiterais mettre l'image 1 lorsque le compteur 2 est à zéro,

    L'image de départ est l'image correspondant à l'image 8

    le script du compteur (id=compteur2)
    Code : Sélectionner tout - Visualiser dans une fenêtre à part
    <input name="compteur2" type="text" id="compteur2" style=background="../Images/fond.gif" ; border:#000000 none 1px; text-align:center; font-size:120px" value="00 " size="4" " readonly="true" min="1" max="5" >

    image 1 lorsque la valeur du compteur2=0 ----> src="C:\Users\hoplacarte\Saved Games\SITE HOPLACARTE1\Images\1.png"
    image 2 lorsque la valeur du compteur2=est >ou = à 1 et <ou = à 8 ----> src="C:\Users\hoplacarte\Saved Games\SITE HOPLACARTE1\Images\2.png"
    image 3 lorsque la valeur du compteur2=est >ou = à 9 et <ou = à 16 ----> src="C:\Users\hoplacarte\Saved Games\SITE HOPLACARTE1\Images\2.png"

    en réalité tous les 8 points

    bouton input problème impossible de bloquervaleur du compteur j'aimerais que celui c ine dépasse pas (-1) points et (+98)points
    Code : Sélectionner tout - Visualiser dans une fenêtre à part
    <input name="compteur2" type="text" id="compteur2" style=background="../Images/fond.gif" ; border:#000000 none 1px; text-align:center; font-size:120px" value="00 " size="4" " readonly="true" min="-1" max="99" >
    fonction javascript increment:
    Code : Sélectionner tout - Visualiser dans une fenêtre à part
    1
    2
    3
    4
    5
    6
    7
    8
    9
    10
    11
    var valeur1=000;
    function modifier_un(increment) {
    	valeur1+=increment;
    	document.getElementById('compteur1').value=valeur1;
    }
     
    var valeur2=000;
    function modifier_deux(increment) {
    	valeur2+=increment;
    	document.getElementById('compteur2').value=valeur2;
    }// JavaScript Document
    voila merci beaucoup de votre aide
    mille fois déjà MERCI

    LAURENT

  2. #2
    Nouveau candidat au Club
    Homme Profil pro
    Développeur Web
    Inscrit en
    Octobre 2016
    Messages
    2
    Détails du profil
    Informations personnelles :
    Sexe : Homme
    Âge : 41
    Localisation : France, Loire (Rhône Alpes)

    Informations professionnelles :
    Activité : Développeur Web
    Secteur : High Tech - Éditeur de logiciels

    Informations forums :
    Inscription : Octobre 2016
    Messages : 2
    Par défaut
    Bonjour,

    Il faut que tu passe par l'appel d'une fonction js sur l'événement onchange de ton input

    Code : Sélectionner tout - Visualiser dans une fenêtre à part
    1
    2
     
    <input name="compteur2" type="text" id="compteur2" onchange="actualiseImg();" ...>
    Voici ensuite les étapes de l'algo à mettre dans la fonction actualiseImg :

    - récupération de la valeur de l'input
    - test de valeur de l'input pour déterminer le src de l'image
    - récupération de l'image à modifier
    - affectation de la nouvelle valeur de l'attribut src à l'image

  3. #3
    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
    image 2 lorsque la valeur du compteur2=est >ou = à 1 et <ou = à 8 ----> src="C:\Users\hoplacarte\Saved Games\SITE HOPLACARTE1\Images\2.png"
    image 3 lorsque la valeur du compteur2=est >ou = à 9 et <ou = à 16 ----> src="C:\Users\hoplacarte\Saved Games\SITE HOPLACARTE1\Images\2.png"


    image 2 = image 3 ???

    mets les path dans un array ...
    en les ayant préchargées
    Code : Sélectionner tout - Visualiser dans une fenêtre à part
    1
    2
    3
    4
    5
    6
    7
    8
    9
    10
    11
    12
     
    image1= new Image();
    image1.scr= ...
     
    image2= new Image();
    image2.scr= ...
     
     
    image3= new Image();
    image3.scr= ...
     
    tabImages= [image1,image2,image3];
    ensuite il ne te reste plus comme dit au dessus qu'à invoquer le bon index d'image sur le test de la valeur voulue ...
    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 !

  4. #4
    Candidat au Club
    Homme Profil pro
    commerce
    Inscrit en
    Septembre 2016
    Messages
    2
    Détails du profil
    Informations personnelles :
    Sexe : Homme
    Âge : 53
    Localisation : France, Bas Rhin (Alsace)

    Informations professionnelles :
    Activité : commerce
    Secteur : Tourisme - Loisirs

    Informations forums :
    Inscription : Septembre 2016
    Messages : 2
    Par défaut merci
    Merci beaucoup pour l'aide, je vais approfondir car j y arrive pas je débute et je me suis un peu emmêlé les pinceaux avec les scripts fournis avant, je vais chercher et si je trouve pas je reviendrais vers vous si vous le permettait
    merci déjà pour votre aide

    LAURENT

Discussions similaires

  1. [Débutant] Changer une image en fonction d'une DropDownList
    Par Mozofeuk dans le forum ASP.NET MVC
    Réponses: 3
    Dernier message: 15/10/2013, 16h09
  2. Réponses: 4
    Dernier message: 14/06/2009, 20h06
  3. Réponses: 10
    Dernier message: 30/03/2009, 14h30
  4. comment changer l'image de fond d'une cellule par un menu ?
    Par @rno0059 dans le forum Mise en page CSS
    Réponses: 18
    Dernier message: 25/06/2007, 00h06
  5. afficher une image en fonction de la valeur d un champ
    Par zahiton dans le forum Langage
    Réponses: 3
    Dernier message: 24/01/2006, 16h22

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