Afficher du texte si on clique sur une image ?

Urgent ...

6 mars 2010 à 18:10:52

Bonjour à tous . Est-ce possible d'afficher du texte si on clique sur une image ?

J'ai testé avec ce code :

Calculatrice.php :

<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Strict//EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-strict.dtd">
<html xmlns="http://www.w3.org/1999/xhtml" xml:lang="fr" lang="fr">
    <head>
        <title>Site De Test</title>
        <meta http-equiv="Content-Type" content="text/html; charset=utf-8" />
		       <link rel="stylesheet" media="screen" type="text/css" title="Design" href="design.css" />
    </head>
	
    <body>
    
	<image src="header_calculatrice.png" id="header"/>
	<image src="onglets.png" id="onglets"/>
	
	<div id="block1"><div id="textonglets"><a href="index.php">Accueil</div>
	<div id="textonglets2"><a href="calculatrice.php">Calculatrice</a></div>
	<div id="textonglets3"><a href="generateur_ecriture.php">Générateur d'écriture</a></div>
	<div id="barre1">|</div><div id="barre2">|</div></div>
	<image src="calculatrice.png" id="calculatrice" />


	<?php $addition = NULL ; ?>
		
<image id="addition" src="boutons/addition.png "onMouseOver="this.src='boutons/addition2.png'" onMouseOut="this.src='boutons/addition.png'" onMouseDown="this.src='boutons/addition3.png'" onclick="this.src='boutons/addition2.png'" onclick="<?php $addition = 1 ; ?>">
<image id="soustraction" src="boutons/soustraction.png "onMouseOver="this.src='boutons/soustraction2.png'" onMouseOut="this.src='boutons/soustraction.png'" onMouseDown="this.src='boutons/soustraction3.png'" onclick="this.src='boutons/soustraction2.png'">
<image id="multiplication" src="boutons/multiplication.png "onMouseOver="this.src='boutons/multiplication2.png'" onMouseOut="this.src='boutons/multiplication.png'" onMouseDown="this.src='boutons/multiplication3.png'" onclick="this.src='boutons/multiplication2.png'">
<image id="division" src="boutons/division.png "onMouseOver="this.src='boutons/division2.png'" onMouseOut="this.src='boutons/division.png'" onMouseDown="this.src='boutons/division3.png'" onclick="this.src='boutons/division2.png'">
</form>
<?php if($addition == NULL) { ?> <div id="text1">Cliquez sur l'un des 4 boutons ci-dessus</div> <?php } 
 else if ($addition == 1) { ?> <div id="text1">Cliquez sur l'un des 2 boutons ci-dessus</div> <?php } ?>  


	

    	
	
	





    </body>
</html>

Mais cela ne marche pas les 2 textes se superposent , comment faire ? Merci d'avance !

EDIT: Help mee !

Minipipo1

6 mars 2010 à 18:56:38

Je pense que tu devrais poster ton problème dans la catégorie Javascript ou demander à un modo de le déplacer.

EDIT: J'ai demandé pour toi

Golmote

7 mars 2010 à 2:38:17

Déjà, le PHP, nous on s'en tape

Donne plutôt le HTML généré (Clic droit -> afficher la page).

Ensuite, ça sort d'où les balises <image> ? o_O

J'ai constaté que ça fonctionnait... mais à ma connaissance c'est <img>... :-°

cbasile06

7 mars 2010 à 21:31:06

Houla, non, surtout pas!
Le PHP, on s'en fout pas du tout, surtout dans ce cas-là, puisque le problème vient d'un mélange PHP/Javascript (<image [...] onclick="<?php $addition = 1; ?>"> , c'est de là que viens le problème, ou plutôt, c'est ce qui montre le problème).

En fait, le PHP est un langage serveur, c'est-à-dire qu'il est exécuté avant que la page soit envoyée (et donc affichée) par le navigateur, alors que le javascript est un langage client, c'est-à-dire qu'il est exécuté par le navigateur, après que la page soit envoyée, donc pendant que l'utilisateur est sur la page.
Il est donc est impossible d'appeler du PHP directement à partir du javascript!

Je pense donc que tu devrais commencer par t'attaquer à un tuto (Tout sur le Javascript, sur ce site, par exemple) sur le javascript (apparement, tu es plutôt un programmeur PHP), de manière à bien comprendre la différence (et apprendre ce langage que tu veux apparement utiliser sans réellement le connaître pour le moment) puis de refaire ta calculatrice, ou alors de la faire uniquement côté serveur, en PHP.

Au passage, c'est un seul onclick par balise, et les attributs ne porte pas de majuscule en XHTML.

Enfin, quoi qu'il en soit, pour résoudre ton problème, tu devrais modifier le texte de ton div via un petit document.getElementById('text1').innerHTML = 'Texte'; , plutôt que de passer par une variable PHP <?php $addition qui ne fonctionnera de toute façon pas.

Sinon, oui, normalement, c'est <img> et pas <image> .