Clique image => changement dans une chaine.

Répondre


Cette question est un moyen d’empêcher des soumissions automatisées de formulaires par des robots.
Smileys
:D :) :( :o :shock: :? 8-) :lol: :x :P :oops: :cry: :evil: :twisted: :roll: :wink: :!: :?: :idea: :arrow: :| :mrgreen: =D> #-o =P~ :^o :non: :priere: 8-|
Voir plus de smileys
  Revue du sujet
 

  Étendre la vue Revue du sujet : Clique image => changement dans une chaine.

Re: Clique image => changement dans une chaine.

par labyelo » 06 avr. 2011, 22:08

http://img215.imageshack.us/i/imagelec.png/ J'aimerais un style comme ça, je sais je suis un peu "chiant", mais je ne connais pas le Javascript =)

Merci beaucoup pour votre aide!

Re: Clique image => changement dans une chaine.

par labyelo » 06 avr. 2011, 21:59

Alors, désolé, je suis un peu "con", j'avais oublié le > à la fin de <script> ... :oops: :oops: ! Fonctionne nickel, encore merci à toi!

Bonne soirée :)

Re: Clique image => changement dans une chaine.

par labyelo » 06 avr. 2011, 21:57

Bonjour, désolé du retard!! :oops: J'ai testé sous google chrome, je vais essayer sous Internet :)

Encore merci. :wink:

Re: Clique image => changement dans une chaine.

par sadeq » 04 avr. 2011, 23:10

C'est bizarre, je l'ai testé sous firefox et internet explorer et ça marche chez moi. non il n'y a pas d'erreur dans le code.
Il remplace bien dans le code la lettre A par 0 quand on clique sur l'image 1 ainsi pour les autres images : B par 1 et C par 2.
T'as quoi comme navigateur :?:

Re: Clique image => changement dans une chaine.

par labyelo » 04 avr. 2011, 18:32

Bonjour,
merci pour avoir pris la peine de m'aider! :wink: Mais un petit problème survient lorsque je test le code, je ne vois pas de changement?! Aucun clique ne se fait sur les images? Une erreur de votre part?

Sinon, merci beaucoup, et j'espère avoir une réponse :)
Bonne fin d'aprêm :)

Re: Clique image => changement dans une chaine.

par sadeq » 03 avr. 2011, 23:47

Bonjour,

Voici un exemple de programme JavaScript qui fait ce que tu veux. L'idée est de stocker dans un tableau de référence, les noms des images et pour chaque image, mémoriser sa section et sa valeur. Comme ça, quand on clique sur une image on utilise son id pour l'identifier et pour retrouver sa section et sa valeur dans le tableau de référence. En suite, on remplace la section trouvée de l'image par sa valeur dans le code stocké dans un DIV.

Voici la page HTML adéquate et le programme Javascript:
<img id="image1" src="imageA.jpg" alt="A" onclick="changeCode(this);" />
<img id="image2" src="imageB.jpg" alt="B" onclick="changeCode(this);" />
<img id="image3" src="imageC.jpg" alt="C" onclick="changeCode(this);" />
<div id="code">ABC</div>
<script>
// tableau des images contenant leur section et valeur
var tab_images = new Array();
tab_images["image1"] = new Array("A","0");
tab_images["image2"] = new Array("B","1");
tab_images["image3"] = new Array("C","2");

function changeCode(imageClicked)
{
	// obtenir le code inscrit dans le div code
	var code = document.getElementById('code').innerHTML;
	// remplacer la lettre de la section de l'image par sa valeur numérique
	var section = tab_images[imageClicked.id][0]; // section de l'image selon le tableau de référence
	var valeur  = tab_images[imageClicked.id][1]; // valeur de l'image selon le tableau de référence
    code = code.replace(section, valeur);
	// replacer le nouveau code dans le div code
	document.getElementById('code').innerHTML = code;
}
</script>

Clique image => changement dans une chaine.

par labyelo » 03 avr. 2011, 20:37

Bonsoir PHPFRANCE,
j'ai une petite demande à vous faire :-) J'aimerais cliquer sur une image tout en changeant mon code. Je m'explique :

Code : Tout sélectionner

*IMAGE* CODE : r;A;B;C;D;E;F
Chaque image comportent une valeur (0,1,2,3,4 ...) et se trouve dans une section (5 images pour A, 3 pour B ect ...).
imaginons, je clique sur l'image dans la section A et dans mon code, la lettre A changera par la valeur de l'image, vous comprenez?

Si oui, je vous remercie d'avance, et désolé si je suis pas très claire ... :s
Anthony :priere: