Débutant demande aide
danidina
Messages postés
16
Date d'inscription
Statut
Membre
Dernière intervention
-
magicshark Messages postés 402 Date d'inscription Statut Membre Dernière intervention -
magicshark Messages postés 402 Date d'inscription Statut Membre Dernière intervention -
Salut à tous,
Je voulais savoir comment faire pour pouvoir changer de texte dans un div en cliquant sur une image (pas de changement de page, mais simplement changer le texte d'un div)?
Dans mon exemple, lorsque je voudrais cliquer sur une des images du div 1, je voudrais que le texte du div 2 change.
Merci d'avance pour vos réponse
Code:
<style type="text/css">
#1 {
width: 500px;
margin-right: auto;
margin-left: auto;
text-align: center;
}
#2 {
width: 500px;
margin-right: auto;
margin-left: auto;
text-align: center;
height: 500px;
}
</style>
</head>
<body>
<div id="1"><img src="http://data.imagup.com/2/1105095357.gif" width="25" height="15" />Fr <img src="http://data.imagup.com/2/1105095400.gif" width="25" height="15" />All</div>
<div id="2">A</div>
</body>
</html>
Je voulais savoir comment faire pour pouvoir changer de texte dans un div en cliquant sur une image (pas de changement de page, mais simplement changer le texte d'un div)?
Dans mon exemple, lorsque je voudrais cliquer sur une des images du div 1, je voudrais que le texte du div 2 change.
Merci d'avance pour vos réponse
Code:
<style type="text/css">
#1 {
width: 500px;
margin-right: auto;
margin-left: auto;
text-align: center;
}
#2 {
width: 500px;
margin-right: auto;
margin-left: auto;
text-align: center;
height: 500px;
}
</style>
</head>
<body>
<div id="1"><img src="http://data.imagup.com/2/1105095357.gif" width="25" height="15" />Fr <img src="http://data.imagup.com/2/1105095400.gif" width="25" height="15" />All</div>
<div id="2">A</div>
</body>
</html>
A voir également:
- Débutant demande aide
- Logiciel de programmation pour débutant - Guide
- Logiciel montage vidéo débutant - Guide
- Apprendre le coran pour débutant (+ pdf) - Télécharger - Histoire & Religion
- Platine dj debutant - Forum Enregistrement / Traitement audio
- Comment utiliser un ordinateur pour un débutant - Astuces et Solutions
6 réponses
faut utilisé du JS,tu procède comme ça
<script type="text/javascript">
var div1 = document.getElementById("1").onclick = function (){
var div2.document.getElementById("2").innerHTML = "nouveautext"
}
</script>
<body>
<div id="1"><img src="http://data.imagup.com/2/1105095357.gif" width="25" height="15" onclick="fnction();"/>Fr <img src="http://data.imagup.com/2/1105095400.gif" width="25" height="15" onclick="fnction();"/>All</div>
<div id="2">A</div>
<script type="text/javascript">
function fnction(){
var div2 = document.getElementById("2").innerHTML = "nouveautext"
}
</body>
ok merci
j'ai finalement trouve avec le code ci-dessous.
Mais j'ai juste une dernier petit question. Comment dois-je faire pour pouvoir mettre mon texte en forme (je voudrais qu'il apparait comme le contenu d'origine du div 2)?
<style type="text/css">
#1 {
width: 500px;
margin-right: auto;
margin-left: auto;
text-align: center;
}
#2 {
width: 500px;
margin-right: auto;
margin-left: auto;
text-align: center;
height: 500px;
}
</style>
<script language="javascript">
function affiche_text(text) {
document.getElementById("2").innerHTML = text;
}
</script>
</head>
<body>
<div id="1"><img src="http://data.imagup.com/2/1105095357.gif"
onclick="affiche_text('A');"
height="15" width="25">
<img src="http://data.imagup.com/2/1105095400.gif"
onclick="affiche_text('B');"
height="15" width="25">
</div>
<div id="2"><strong style="color: rgb(68, 68, 68);"><span
style="font-size: 12px;">X <span
style="color: red;">X</span> (<span style="color: red;">X</span>)X X <span style="color: red;">X</span> X</span></strong><br />
<br /><strong style="color: rgb(68, 68, 68);"><span
style="font-size: 10px;">X</span></strong></div>
</div>
</body>
</html>
j'ai finalement trouve avec le code ci-dessous.
Mais j'ai juste une dernier petit question. Comment dois-je faire pour pouvoir mettre mon texte en forme (je voudrais qu'il apparait comme le contenu d'origine du div 2)?
<style type="text/css">
#1 {
width: 500px;
margin-right: auto;
margin-left: auto;
text-align: center;
}
#2 {
width: 500px;
margin-right: auto;
margin-left: auto;
text-align: center;
height: 500px;
}
</style>
<script language="javascript">
function affiche_text(text) {
document.getElementById("2").innerHTML = text;
}
</script>
</head>
<body>
<div id="1"><img src="http://data.imagup.com/2/1105095357.gif"
onclick="affiche_text('A');"
height="15" width="25">
<img src="http://data.imagup.com/2/1105095400.gif"
onclick="affiche_text('B');"
height="15" width="25">
</div>
<div id="2"><strong style="color: rgb(68, 68, 68);"><span
style="font-size: 12px;">X <span
style="color: red;">X</span> (<span style="color: red;">X</span>)X X <span style="color: red;">X</span> X</span></strong><br />
<br /><strong style="color: rgb(68, 68, 68);"><span
style="font-size: 10px;">X</span></strong></div>
</div>
</body>
</html>
Vous n’avez pas trouvé la réponse que vous recherchez ?
Posez votre question
Conseil il faut apprendre a forger avant de forger ... médite là dessus ce n'est pas de la méchanceté juste que si tu continu tu finira par faire un site plus que bancale et que quand tu saura faire au moment de reprendre ton code tu va :
1) pleurer
2)te pendre ( je te le déconseille :D)
3)tout recoder
donc mieux vos attendre un petit mois ou tu pourra bien lire des tutos xhtml css (site du zero = GOOD) et après tu verra tout tes problème serons de la rigolades (en générale)
après si certains points de tes tutos te sembles confus rien ne t'empêche de venir nous demander de t'expliquer.
désolé
1) pleurer
2)te pendre ( je te le déconseille :D)
3)tout recoder
donc mieux vos attendre un petit mois ou tu pourra bien lire des tutos xhtml css (site du zero = GOOD) et après tu verra tout tes problème serons de la rigolades (en générale)
après si certains points de tes tutos te sembles confus rien ne t'empêche de venir nous demander de t'expliquer.
désolé