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 :

Affichage d'une image différemment selon les navigateurs


Sujet :

JavaScript

  1. #1
    Membre du Club
    Homme Profil pro
    Ingénieur développement logiciels
    Inscrit en
    Mai 2012
    Messages
    79
    Détails du profil
    Informations personnelles :
    Sexe : Homme
    Âge : 33
    Localisation : France, Haute Garonne (Midi Pyrénées)

    Informations professionnelles :
    Activité : Ingénieur développement logiciels
    Secteur : High Tech - Éditeur de logiciels

    Informations forums :
    Inscription : Mai 2012
    Messages : 79
    Points : 62
    Points
    62
    Par défaut Affichage d'une image différemment selon les navigateurs
    Bonjour à tous,

    Je vous explique la situation: je souhaite afficher une image différente selon les conditions.

    Voici le code de la fonction:
    Code : Sélectionner tout - Visualiser dans une fenêtre à part
    1
    2
    3
    4
    5
    6
    7
    8
    9
    10
    11
    12
    13
    14
    15
    16
    17
    18
    19
    20
    21
    22
    23
    24
    25
    26
    27
    28
    29
    30
    31
    32
    33
    34
    35
    36
    37
    38
    39
    40
    41
    42
    43
    44
    45
    46
    47
    48
    49
    50
    51
    52
    53
    54
    55
    56
    57
    58
    59
    60
    61
    62
    63
    64
    65
    66
    67
    68
    69
    70
    71
    72
    73
    74
    75
    76
    77
    78
    79
    80
    81
    82
    83
    84
    85
    86
    87
    88
    89
    90
    91
    92
    93
    function loadQuiz(qnum) 
    {
    	if (typeof(quizArray) !== 'undefined')
    	{
    		displayQuiz(ent = document.getElementById('quiz1'),qnum++);
    		var newB = document.createElement("button");
    		//je déclare ma variable qui servira à afficher l'image
    		var newImg = document.createElement("image");
    		//Voici le premier état: l'image "A" s'affiche d'origine
    		newImg.src = "images/normal.gif";
    		newB.appendChild(newImg);
    		newB.style.styleFloat = 'left';
    		newB.style.cssFloat = 'left';
    		var rightA = quizArray.split("|");
    		var rightA = rightA[1].split("//");
    		var rightA = rightA[0];
     
    		newB.onclick = function validateQuestion(){
    		var count=0, verif=0, numGoodAnswer="";
    			for(var i=0;i<4;i++)
    			{
    				//If the answer is equal to the right answer
    				if(document.form_answer.a[i].checked){	
    					count++;
    					//If the answer is good
    					if(document.form_answer.a[i].value==rightA){
    						//Voici le second état: l'image "B" s'affiche
    						newImg.src = "images/happy.gif";
    						newB.appendChild(newImg);
    						document.form_answer.answer.value=document.form.lastAns.value+1;
    					}
    					else{
    						//If the answer is not good
    						//To color in red the wrong answer
    						document.form_answer.answer.value=document.form.lastAns.value+0;
    						verif=1;
    						//Voici le troisième état: l'image "C" s'affiche
    						newImg.src = "images/bad.gif";
    						newB.appendChild(newImg);
    						numGoodAnswer="l"+i;
    						document.getElementById(numGoodAnswer).style.backgroundColor='#CC0000';
    					}
    				}
    			}
    			//To color in green the right answer
    			for(var i=0;i<4;i++)
    			{
    				if(document.form_answer.a[i].value==rightA && count != 0){
    				numGoodAnswer="l"+i;
    				time = 1;
    				document.getElementById(numGoodAnswer).style.backgroundColor='#33CC00';
    				}
    			}
     
    			//The user must choose an answer before to click on next
    			if(count == 0){
    				alert("Please select an answer before to click Next 1!!");			
    			} else{
    				//Check if the user selected the wrong answer
    				//And if he did, he has to wait 7 sec
    				if(verif == 1)
    				{
    					newB.disabled = 'disabled';
    					setInterval(function () {nextPage(qnum);}, 7000);
    					return false;
    				} else {
    					nextPage(qnum);
    			    		return false;
    				}
    			}
    		}
    		var newTb = document.createTextNode("Next");
    		if(Number(qnum)== Number(nbQ))
    		newTb = document.createTextNode('Finish');
    		newB.appendChild(newTb);
    		ent.appendChild(newB);
    		var timel = quizArray.split('|');
    		timel = timel[1].split('//');
    		timel = timel[1];
    		document.form_answer.qid.value=document.form.IDs.value;
    		document.form_answer.time.value=document.form.starttime.value;
    		resetTimer(timel,qnum);
    		decrementTimer();
     
    	}else
    	{
    		if (typeof(nbQ) !== 'undefined')
    		{
    			if (qnum>=nbQ) 
    				displayResult();
    		}
    	}
    }
    Seulement il y a une ambiguité, l'image "A" et "C" s'affichent correctement par contre l'image "B" ne s'affiche pas. J'ai pourtant bien regardé le chemin de l'image et si elle était présente dans le dossier en ligne.

    De plus, l'affichage de ces deux images fonctionne unniquement sous Google Chrome, ça ne fonctionne pas sous Mozilla Firefox par exemple.

    Ne connaissant que très peu JavaScript, je peine énormément à essayer de corriger ce problème.

    Je vous remercie pour votre aide

    ps: si vous avez besoin de plus d'information faites le moi savoir

  2. #2
    Rédacteur/Modérateur
    Avatar de andry.aime
    Homme Profil pro
    Inscrit en
    Septembre 2007
    Messages
    8 391
    Détails du profil
    Informations personnelles :
    Sexe : Homme
    Localisation : Ile Maurice

    Informations forums :
    Inscription : Septembre 2007
    Messages : 8 391
    Points : 15 059
    Points
    15 059
    Par défaut
    Bonjour,

    var newImg = document.createElement("image");
    Code : Sélectionner tout - Visualiser dans une fenêtre à part
    var newImg = document.createElement("img");
    A+.

  3. #3
    Membre du Club
    Homme Profil pro
    Ingénieur développement logiciels
    Inscrit en
    Mai 2012
    Messages
    79
    Détails du profil
    Informations personnelles :
    Sexe : Homme
    Âge : 33
    Localisation : France, Haute Garonne (Midi Pyrénées)

    Informations professionnelles :
    Activité : Ingénieur développement logiciels
    Secteur : High Tech - Éditeur de logiciels

    Informations forums :
    Inscription : Mai 2012
    Messages : 79
    Points : 62
    Points
    62
    Par défaut
    Merci pour ta réponse, j'ai effectué la correction.

    Ca fonctionne parfaitement bien

    Encore une fois, merci !

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

Discussions similaires

  1. [MySQL] Affichage d'une image spécifiée selon 2 champs date et date du jour
    Par tyler94 dans le forum PHP & Base de données
    Réponses: 108
    Dernier message: 03/01/2012, 09h19
  2. Comment faire un alignement vertical d'une image pour tous les navigateurs?
    Par Alexandrebox dans le forum Mise en page CSS
    Réponses: 10
    Dernier message: 06/04/2009, 14h10
  3. affichage d'une image selon table sql
    Par math8811 dans le forum Langage
    Réponses: 9
    Dernier message: 27/11/2008, 11h53
  4. affichage d'une image avec les servlets
    Par hassanovich dans le forum Servlets/JSP
    Réponses: 4
    Dernier message: 03/11/2006, 10h35

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