Accueil > Forum > > > > carte interactive
 carte interactive
dimanche 7 septembre 2003 à 14:11:15 |
carte interactive
Auklaar
|
Bonjour à tous ! voila g un problème.J'ai une image sur laquelle j'ai créer des zones reactives. Je voudrais que lorsque je passe la sourie sur ces zones reactives, la couleur de ces zones change. Je voudrais aussi que lorsque je clique sur ces zones reactives un texte s'affiche dans une autre cellule. Un exemple d'une zone reactive : <area shape="rect" coords="150,116,220,178" href="#conte"> Comment puis-je faire? merci d'avance ______________________________________________________ Chaque problème a sa solution, si tu n'en as pas ne t'inquiète pas ca ne change rien au problème. |
|
lundi 8 septembre 2003 à 02:13:30 |
Re : carte interactive
Houzefa
|
dans le <area> tu rajoutes : | onMouseOver="survol(this, 0)" onMouseOut="survol(this, 1)" |
et tu fais une fonction survol de ce style : function survol(objet, type){
objet.style.background = (type==0) ? "#FF0000" : "#FFFFFF" ;
} |
pour ton 2ème pb tu mets des <span> dans ta page (les cellules) et tu utilises des innerHTML : | <span id="calque"></span> |
et pour écrire qqchose dans calque : | document.getElementById("calque").innerHTML="<b>Code HTML</b>"; |
Houzéf@ - www.123toto.com------------------------------- Réponse au message : ------------------------------- > Bonjour à tous ! > voila g un problème.J'ai une image sur laquelle j'ai créer des zones reactives. Je voudrais que lorsque je passe la sourie sur ces zones reactives, la couleur de ces zones change. Je voudrais aussi que lorsque je clique sur ces zones reactives un texte s'affiche dans une autre cellule. Un exemple d'une zone reactive : <area shape="rect" coords="150,116,220,178" href="#conte"> > Comment puis-je faire? > merci d'avance > > ______________________________________________________ > > Chaque problème a sa solution, si tu n'en as pas ne t'inquiète pas ca ne change rien au problème. |
|
mardi 9 septembre 2003 à 17:01:27 |
Re : carte interactive
Auklaar
|
merci mais j'ai toujours un problème, ta fonction surbol tu la met ou et entre quel balises? merci beaucoup ------------------------------- Réponse au message : ------------------------------- > dans le <area> tu rajoutes : > | onMouseOver="survol(this, 0)" onMouseOut="survol(this, 1)" |
> et tu fais une fonction survol de ce style : > function survol(objet, type){
> objet.style.background = (type==0) ? "#FF0000" : "#FFFFFF" ;
> } |
> > pour ton 2ème pb tu mets des <span> dans ta page (les cellules) et tu utilises des innerHTML : > | <span id="calque"></span> |
> et pour écrire qqchose dans calque : > | document.getElementById("calque").innerHTML="<b>Code HTML</b>"; |
> > Houzéf@ - www.123toto.com> > > ------------------------------- > Réponse au message : > ------------------------------- > > > Bonjour à tous ! > > voila g un problème.J'ai une image sur laquelle j'ai créer des zones reactives. Je voudrais que lorsque je passe la sourie sur ces zones reactives, la couleur de ces zones change. Je voudrais aussi que lorsque je clique sur ces zones reactives un texte s'affiche dans une autre cellule. Un exemple d'une zone reactive : <area shape="rect" coords="150,116,220,178" href="#conte"> > > Comment puis-je faire? > > merci d'avance > > > > ______________________________________________________ > > > > Chaque problème a sa solution, si tu n'en as pas ne t'inquiète pas ca ne change rien au problème.> |
|
mercredi 10 septembre 2003 à 01:23:26 |
Re : carte interactive
Houzefa
|
voici la structure de ta page : <html>
<head>
<title>Titre</title>
<script language="JavaScript">
function survol(objet, type){
objet.style.background = (type==0) ? "#FF0000" : "#FFFFFF" ;
}
function message(){
document.getElementById("calque").innerHTML="<b>Code HTML</b>";
}
</script>
</head>
<body>
<area shape="rect" coords="150,116,220,178" href="#conte" onMouseOver="survol(this, 0)" onMouseOut="survol(this, 1)" onClick="message()">
<span id="calque"></span>
</body>
</html> |
Houzéf@ - www.123toto.com------------------------------- Réponse au message : ------------------------------- > merci mais j'ai toujours un problème, ta fonction surbol tu la met ou et entre quel balises? > merci beaucoup > > ------------------------------- > Réponse au message : > ------------------------------- > > > dans le <area> tu rajoutes : > > | onMouseOver="survol(this, 0)" onMouseOut="survol(this, 1)" |
> > et tu fais une fonction survol de ce style : > > function survol(objet, type){
> > objet.style.background = (type==0) ? "#FF0000" : "#FFFFFF" ;
> > } |
> > > > pour ton 2ème pb tu mets des <span> dans ta page (les cellules) et tu utilises des innerHTML : > > | <span id="calque"></span> |
> > et pour écrire qqchose dans calque : > > | document.getElementById("calque").innerHTML="<b>Code HTML</b>"; |
> > > > Houzéf@ - www.123toto.com> > > > > > ------------------------------- > > Réponse au message : > > ------------------------------- > > > > > Bonjour à tous ! > > > voila g un problème.J'ai une image sur laquelle j'ai créer des zones reactives. Je voudrais que lorsque je passe la sourie sur ces zones reactives, la couleur de ces zones change. Je voudrais aussi que lorsque je clique sur ces zones reactives un texte s'affiche dans une autre cellule. Un exemple d'une zone reactive : <area shape="rect" coords="150,116,220,178" href="#conte"> > > > Comment puis-je faire? > > > merci d'avance > > > > > > ______________________________________________________ > > > > > > Chaque problème a sa solution, si tu n'en as pas ne t'inquiète pas ca ne change rien au problème.> > > |
|
mercredi 10 septembre 2003 à 20:32:18 |
Re : carte interactive
Auklaar
|
merci de consacrer un peu de ton temps pour moi mais es-tu sur que ca marche? Chez moi ca ne marche pas et je ne comprend pas pourkoi. Pour afficher un text au click de la sourie jme suis demerdé avec une iframe mais pour la couleur qui change au survol ca marche pas pourtant j'ai bien mis la fonction juste avant le </head> et rajouter la ligne de code dans le <area shape>. Ya-t'il un autre moyen? merci beaucoup. ------------------------------- Réponse au message : ------------------------------- > voici la structure de ta page : > <html>
>
> <head>
> <title>Titre</title>
>
> <script language="JavaScript">
> function survol(objet, type){
> objet.style.background = (type==0) ? "#FF0000" : "#FFFFFF" ;
> }
> function message(){
> document.getElementById("calque").innerHTML="<b>Code HTML</b>";
> }
> </script>
>
> </head>
>
> <body>
>
> <area shape="rect" coords="150,116,220,178" href="#conte" onMouseOver="survol(this, 0)" onMouseOut="survol(this, 1)" onClick="message()">
>
> <span id="calque"></span>
>
> </body>
>
> </html> |
> > Houzéf@ - www.123toto.com> > > ------------------------------- > Réponse au message : > ------------------------------- > > > merci mais j'ai toujours un problème, ta fonction surbol tu la met ou et entre quel balises? > > merci beaucoup > > > > ------------------------------- > > Réponse au message : > > ------------------------------- > > > > > dans le <area> tu rajoutes : > > > | onMouseOver="survol(this, 0)" onMouseOut="survol(this, 1)" |
> > > et tu fais une fonction survol de ce style : > > > function survol(objet, type){
> > > objet.style.background = (type==0) ? "#FF0000" : "#FFFFFF" ;
> > > } |
> > > > > > pour ton 2ème pb tu mets des <span> dans ta page (les cellules) et tu utilises des innerHTML : > > > | <span id="calque"></span> |
> > > et pour écrire qqchose dans calque : > > > | document.getElementById("calque").innerHTML="<b>Code HTML</b>"; |
> > > > > > Houzéf@ - www.123toto.com> > > > > > > > > ------------------------------- > > > Réponse au message : > > > ------------------------------- > > > > > > > Bonjour à tous ! > > > > voila g un problème.J'ai une image sur laquelle j'ai créer des zones reactives. Je voudrais que lorsque je passe la sourie sur ces zones reactives, la couleur de ces zones change. Je voudrais aussi que lorsque je clique sur ces zones reactives un texte s'affiche dans une autre cellule. Un exemple d'une zone reactive : <area shape="rect" coords="150,116,220,178" href="#conte"> > > > > Comment puis-je faire? > > > > merci d'avance > > > > > > > > ______________________________________________________ > > > > > > > > Chaque problème a sa solution, si tu n'en as pas ne t'inquiète pas ca ne change rien au problème.> > > > > > |
|
jeudi 11 septembre 2003 à 01:04:51 |
Re : carte interactive
Houzefa
|
je viens de tester ce code avec une image et ca marche très bien. cependant, il faut bien choisir l'image de laquelle tu veux changer la couleur d'arrière-plan : il faut que ce soit une image gif, avec certaines parties de cette image qui soient transparentes. avec d'autres types d'images non-transparentes, ca peut pas marcher. a cette adresse, voila l'icone de mon site, qui est une image gif avec un fond transparent :  [ Lien ]pour faire un test, remplace : | <area shape="rect" coords="150,116,220,178" href="#conte" onMouseOver="survol(this, 0)" onMouseOut="survol(this, 1)" onClick="message()"> |
par : | <img src="http://www.123toto.com/icone.gif" href="#" onMouseOver="survol(this, 0)" onMouseOut="survol(this, 1)" onClick="message()"> |
Houzéf@ - www.123toto.com------------------------------- Réponse au message : ------------------------------- > merci de consacrer un peu de ton temps pour moi mais es-tu sur que ca marche? Chez moi ca ne marche pas et je ne comprend pas pourkoi. Pour afficher un text au click de la sourie jme suis demerdé avec une iframe mais pour la couleur qui change au survol ca marche pas pourtant j'ai bien mis la fonction juste avant le </head> et rajouter la ligne de code dans le <area shape>. Ya-t'il un autre moyen? merci beaucoup. > > ------------------------------- > Réponse au message : > ------------------------------- > > > voici la structure de ta page : > > <html>
> >
> > <head>
> > <title>Titre</title>
> >
> > <script language="JavaScript">
> > function survol(objet, type){
> > objet.style.background = (type==0) ? "#FF0000" : "#FFFFFF" ;
> > }
> > function message(){
> > document.getElementById("calque").innerHTML="<b>Code HTML</b>";
> > }
> > </script>
> >
> > </head>
> >
> > <body>
> >
> > <area shape="rect" coords="150,116,220,178" href="#conte" onMouseOver="survol(this, 0)" onMouseOut="survol(this, 1)" onClick="message()">
> >
> > <span id="calque"></span>
> >
> > </body>
> >
> > </html> |
> > > > Houzéf@ - www.123toto.com> > > > > > ------------------------------- > > Réponse au message : > > ------------------------------- > > > > > merci mais j'ai toujours un problème, ta fonction surbol tu la met ou et entre quel balises? > > > merci beaucoup > > > > > > ------------------------------- > > > Réponse au message : > > > ------------------------------- > > > > > > > dans le <area> tu rajoutes : > > > > | onMouseOver="survol(this, 0)" onMouseOut="survol(this, 1)" |
> > > > et tu fais une fonction survol de ce style : > > > > function survol(objet, type){
> > > > objet.style.background = (type==0) ? "#FF0000" : "#FFFFFF" ;
> > > > } |
> > > > > > > > pour ton 2ème pb tu mets des <span> dans ta page (les cellules) et tu utilises des innerHTML : > > > > | <span id="calque"></span> |
> > > > et pour écrire qqchose dans calque : > > > > | document.getElementById("calque").innerHTML="<b>Code HTML</b>"; |
> > > > > > > > Houzéf@ - www.123toto.com> > > > > > > > > > > > ------------------------------- > > > > Réponse au message : > > > > ------------------------------- > > > > > > > > > Bonjour à tous ! > > > > > voila g un problème.J'ai une image sur laquelle j'ai créer des zones reactives. Je voudrais que lorsque je passe la sourie sur ces zones reactives, la couleur de ces zones change. Je voudrais aussi que lorsque je clique sur ces zones reactives un texte s'affiche dans une autre cellule. Un exemple d'une zone reactive : <area shape="rect" coords="150,116,220,178" href="#conte"> > > > > > Comment puis-je faire? > > > > > merci d'avance > > > > > > > > > > ______________________________________________________ > > > > > > > > > > Chaque problème a sa solution, si tu n'en as pas ne t'inquiète pas ca ne change rien au problème.> > > > > > > > > > |
|
samedi 13 septembre 2003 à 15:39:03 |
Re : carte interactive
Auklaar
|
Ton script marche très bien avec une image mais il ne marche pas avec une zone interactive de type<area>. En plus je crois que tu n'as pas compris ce que je veux. Ce n'est pas l'arrière plan que je veux changer mails la couleur de la zone interactive qui est sur mon image. Mon image est une carte et il n'ya pas d'arrière plan. Merci quand meme. Si quelqu'un peut m'aidez svp! merci d'avance. ------------------------------- Réponse au message : ------------------------------- > je viens de tester ce code avec une image et ca marche très bien. cependant, il faut bien choisir l'image de laquelle tu veux changer la couleur d'arrière-plan : il faut que ce soit une image gif, avec certaines parties de cette image qui soient transparentes. avec d'autres types d'images non-transparentes, ca peut pas marcher. > > a cette adresse, voila l'icone de mon site, qui est une image gif avec un fond transparent : [ Lien ]> > pour faire un test, remplace : > | <area shape="rect" coords="150,116,220,178" href="#conte" onMouseOver="survol(this, 0)" onMouseOut="survol(this, 1)" onClick="message()"> |
> > par : > | <img src="http://www.123toto.com/icone.gif" href="#" onMouseOver="survol(this, 0)" onMouseOut="survol(this, 1)" onClick="message()"> |
> > Houzéf@ - www.123toto.com> > > ------------------------------- > Réponse au message : > ------------------------------- > > > merci de consacrer un peu de ton temps pour moi mais es-tu sur que ca marche? Chez moi ca ne marche pas et je ne comprend pas pourkoi. Pour afficher un text au click de la sourie jme suis demerdé avec une iframe mais pour la couleur qui change au survol ca marche pas pourtant j'ai bien mis la fonction juste avant le </head> et rajouter la ligne de code dans le <area shape>. Ya-t'il un autre moyen? merci beaucoup. > > > > ------------------------------- > > Réponse au message : > > ------------------------------- > > > > > voici la structure de ta page : > > > <html>
> > >
> > > <head>
> > > <title>Titre</title>
> > >
> > > <script language="JavaScript">
> > > function survol(objet, type){
> > > objet.style.background = (type==0) ? "#FF0000" : "#FFFFFF" ;
> > > }
> > > function message(){
> > > document.getElementById("calque").innerHTML="<b>Code HTML</b>";
> > > }
> > > </script>
> > >
> > > </head>
> > >
> > > <body>
> > >
> > > <area shape="rect" coords="150,116,220,178" href="#conte" onMouseOver="survol(this, 0)" onMouseOut="survol(this, 1)" onClick="message()">
> > >
> > > <span id="calque"></span>
> > >
> > > </body>
> > >
> > > </html> |
> > > > > > Houzéf@ - www.123toto.com> > > > > > > > > ------------------------------- > > > Réponse au message : > > > ------------------------------- > > > > > > > merci mais j'ai toujours un problème, ta fonction surbol tu la met ou et entre quel balises? > > > > merci beaucoup > > > > > > > > ------------------------------- > > > > Réponse au message : > > > > ------------------------------- > > > > > > > > > dans le <area> tu rajoutes : > > > > > | onMouseOver="survol(this, 0)" onMouseOut="survol(this, 1)" |
> > > > > et tu fais une fonction survol de ce style : > > > > > function survol(objet, type){
> > > > > objet.style.background = (type==0) ? "#FF0000" : "#FFFFFF" ;
> > > > > } |
> > > > > > > > > > pour ton 2ème pb tu mets des <span> dans ta page (les cellules) et tu utilises des innerHTML : > > > > > | <span id="calque"></span> |
> > > > > et pour écrire qqchose dans calque : > > > > > | document.getElementById("calque").innerHTML="<b>Code HTML</b>"; |
> > > > > > > > > > Houzéf@ - www.123toto.com> > > > > > > > > > > > > > > ------------------------------- > > > > > Réponse au message : > > > > > ------------------------------- > > > > > > > > > > > Bonjour à tous ! > > > > > > voila g un problème.J'ai une image sur laquelle j'ai créer des zones reactives. Je voudrais que lorsque je passe la sourie sur ces zones reactives, la couleur de ces zones change. Je voudrais aussi que lorsque je clique sur ces zones reactives un texte s'affiche dans une autre cellule. Un exemple d'une zone reactive : <area shape="rect" coords="150,116,220,178" href="#conte"> > > > > > > Comment puis-je faire? > > > > > > merci d'avance > > > > > > > > > > > > ______________________________________________________ > > > > > > > > > > > > Chaque problème a sa solution, si tu n'en as pas ne t'inquiète pas ca ne change rien au problème.> > > > > > > > > > > > > > > |
|
dimanche 14 septembre 2003 à 05:59:54 |
Re : carte interactive
Houzefa
|
dans ce cas g pas trop de réponse... tu ne peux pas changer le contenu d'une image, puisque ce que tu veux faire revient a peu près a untiliser l'outil "pot de peinture" qu'il ya dans les logiciels de dessin. et en javascript c impossible. par contre ya une solution en PHP, mais assez compliquée : pour chaque zone <area>, PHP génère automatiquement une image différente de l'image de base et la sauve dans un répertoire. ensuite dans le script, faut juste changer l'adresse de l'image chaque fois qu'on survole une <area>. si ton image ne change pas, tu peux aussi faire ces images toi-meme et les mettre dans un dossier. ensuite le javascript est très simple, suffit de mettre : | onMouseOver="document.images [ 0 ] .src='image_1.jpg'" onMouseOut="document.images [ 0 ] .src='image_0.jpg'" |
ce code suppose que l'image a changer (celle qui contient l'ensemble des zones réactives) s'appelle image_0.jpg et que lorsqu'on survole une zone faut mettre l'image image_1.jpg. de + faut que ton image soit la 1ère de la page. si c'est par ex la 6ème image de la page, faut mettre un [ 5 ] au lieu du [ 0 ]. Chaque problème a sa solution, et jcrois bien l'avoir trouvée ! :)Houzéf@ - [url="http://www.123toto.com"]www.123toto.com[/url]------------------------------- Réponse au message : ------------------------------- > Ton script marche très bien avec une image mais il ne marche pas avec une zone interactive de type<area>. En plus je crois que tu n'as pas compris ce que je veux. Ce n'est pas l'arrière plan que je veux changer mails la couleur de la zone interactive qui est sur mon image. Mon image est une carte et il n'ya pas d'arrière plan. Merci quand meme. Si quelqu'un peut m'aidez svp! merci d'avance. > > ------------------------------- > Réponse au message : > ------------------------------- > > > je viens de tester ce code avec une image et ca marche très bien. cependant, il faut bien choisir l'image de laquelle tu veux changer la couleur d'arrière-plan : il faut que ce soit une image gif, avec certaines parties de cette image qui soient transparentes. avec d'autres types d'images non-transparentes, ca peut pas marcher. > > > > a cette adresse, voila l'icone de mon site, qui est une image gif avec un fond transparent : [url]http://www.123toto.com/icone.gif[/url] > > > > pour faire un test, remplace : > > | <area shape="rect" coords="150,116,220,178" href="#conte" onMouseOver="survol(this, 0)" onMouseOut="survol(this, 1)" onClick="message()"> |
> > > > par : > > | <img src="http://www.123toto.com/icone.gif" href="#" onMouseOver="survol(this, 0)" onMouseOut="survol(this, 1)" onClick="message()"> |
> > > > Houzéf@ - [url="http://www.123toto.com"]www.123toto.com[/url]> > > > > > ------------------------------- > > Réponse au message : > > ------------------------------- > > > > > merci de consacrer un peu de ton temps pour moi mais es-tu sur que ca marche? Chez moi ca ne marche pas et je ne comprend pas pourkoi. Pour afficher un text au click de la sourie jme suis demerdé avec une iframe mais pour la couleur qui change au survol ca marche pas pourtant j'ai bien mis la fonction juste avant le </head> et rajouter la ligne de code dans le <area shape>. Ya-t'il un autre moyen? merci beaucoup. > > > > > > ------------------------------- > > > Réponse au message : > > > ------------------------------- > > > > > > > voici la structure de ta page : > > > > <html>
> > > >
> > > > <head>
> > > > <title>Titre</title>
> > > >
> > > > <script language="JavaScript">
> > > > function survol(objet, type){
> > > > objet.style.background = (type==0) ? "#FF0000" : "#FFFFFF" ;
> > > > }
> > > > function message(){
> > > > document.getElementById("calque").innerHTML="<b>Code HTML</b>";
> > > > }
> > > > </script>
> > > >
> > > > </head>
> > > >
> > > > <body>
> > > >
> > > > <area shape="rect" coords="150,116,220,178" href="#conte" onMouseOver="survol(this, 0)" onMouseOut="survol(this, 1)" onClick="message()">
> > > >
> > > > <span id="calque"></span>
> > > >
> > > > </body>
> > > >
> > > > </html> |
> > > > > > > > Houzéf@ - [url="http://www.123toto.com"]www.123toto.com[/url]> > > > > > > > > > > > ------------------------------- > > > > Réponse au message : > > > > ------------------------------- > > > > > > > > > merci mais j'ai toujours un problème, ta fonction surbol tu la met ou et entre quel balises? > > > > > merci beaucoup > > > > > > > > > > ------------------------------- > > > > > Réponse au message : > > > > > ------------------------------- > > > > > > > > > > > dans le <area> tu rajoutes : > > > > > > | onMouseOver="survol(this, 0)" onMouseOut="survol(this, 1)" |
> > > > > > et tu fais une fonction survol de ce style : > > > > > > function survol(objet, type){
> > > > > > objet.style.background = (type==0) ? "#FF0000" : "#FFFFFF" ;
> > > > > > } |
> > > > > > > > > > > > pour ton 2ème pb tu mets des <span> dans ta page (les cellules) et tu utilises des innerHTML : > > > > > > | <span id="calque"></span> |
> > > > > > et pour écrire qqchose dans calque : > > > > > > | document.getElementById("calque").innerHTML="<b>Code HTML</b>"; |
> > > > > > > > > > > > Houzéf@ - [url="http://www.123toto.com"]www.123toto.com[/url]> > > > > > > > > > > > > > > > > > ------------------------------- > > > > > > Réponse au message : > > > > > > ------------------------------- > > > > > > > > > > > > > Bonjour à tous ! > > > > > > > voila g un problème.J'ai une image sur laquelle j'ai créer des zones reactives. Je voudrais que lorsque je passe la sourie sur ces zones reactives, la couleur de ces zones change. Je voudrais aussi que lorsque je clique sur ces zones reactives un texte s'affiche dans une autre cellule. Un exemple d'une zone reactive : <area shape="rect" coords="150,116,220,178" href="#conte"> > > > > > > > Comment puis-je faire? > > > > > > > merci d'avance > > > > > > > > > > > > > > ______________________________________________________ > > > > > > > > > > > > > > Chaque problème a sa solution, si tu n'en as pas ne t'inquiète pas ca ne change rien au problème.> > > > > > > > > > > > > > > > > > > > > |
|
dimanche 14 septembre 2003 à 11:11:26 |
Re : carte interactive
Auklaar
|
merci beaucoup, je vais tester cette solution dès que j'ai le temps. Je pense que ca dvrait marcher. Je te tiendrais informé. encore merci. ------------------------------- Réponse au message : ------------------------------- > dans ce cas g pas trop de réponse... tu ne peux pas changer le contenu d'une image, puisque ce que tu veux faire revient a peu près a untiliser l'outil "pot de peinture" qu'il ya dans les logiciels de dessin. et en javascript c impossible. > > par contre ya une solution en PHP, mais assez compliquée : pour chaque zone <area>, PHP génère automatiquement une image différente de l'image de base et la sauve dans un répertoire. ensuite dans le script, faut juste changer l'adresse de l'image chaque fois qu'on survole une <area>. > > si ton image ne change pas, tu peux aussi faire ces images toi-meme et les mettre dans un dossier. ensuite le javascript est très simple, suffit de mettre : > | onMouseOver="document.images [ 0 ] .src='image_1.jpg'" onMouseOut="document.images [ 0 ] .src='image_0.jpg'" |
> ce code suppose que l'image a changer (celle qui contient l'ensemble des zones réactives) s'appelle image_0.jpg et que lorsqu'on survole une zone faut mettre l'image image_1.jpg. de + faut que ton image soit la 1ère de la page. si c'est par ex la 6ème image de la page, faut mettre un [ 5 ] au lieu du [ 0 ]. > > Chaque problème a sa solution, et jcrois bien l'avoir trouvée ! :)> > > Houzéf@ - www.123toto.com> > > ------------------------------- > Réponse au message : > ------------------------------- > > > Ton script marche très bien avec une image mais il ne marche pas avec une zone interactive de type<area>. En plus je crois que tu n'as pas compris ce que je veux. Ce n'est pas l'arrière plan que je veux changer mails la couleur de la zone interactive qui est sur mon image. Mon image est une carte et il n'ya pas d'arrière plan. Merci quand meme. Si quelqu'un peut m'aidez svp! merci d'avance. > > > > ------------------------------- > > Réponse au message : > > ------------------------------- > > > > > je viens de tester ce code avec une image et ca marche très bien. cependant, il faut bien choisir l'image de laquelle tu veux changer la couleur d'arrière-plan : il faut que ce soit une image gif, avec certaines parties de cette image qui soient transparentes. avec d'autres types d'images non-transparentes, ca peut pas marcher. > > > > > > a cette adresse, voila l'icone de mon site, qui est une image gif avec un fond transparent : [ Lien ]> > > > > > pour faire un test, remplace : > > > | <area shape="rect" coords="150,116,220,178" href="#conte" onMouseOver="survol(this, 0)" onMouseOut="survol(this, 1)" onClick="message()"> |
> > > > > > par : > > > | <img src="http://www.123toto.com/icone.gif" href="#" onMouseOver="survol(this, 0)" onMouseOut="survol(this, 1)" onClick="message()"> |
> > > > > > Houzéf@ - www.123toto.com> > > > > > > > > ------------------------------- > > > Réponse au message : > > > ------------------------------- > > > > > > > merci de consacrer un peu de ton temps pour moi mais es-tu sur que ca marche? Chez moi ca ne marche pas et je ne comprend pas pourkoi. Pour afficher un text au click de la sourie jme suis demerdé avec une iframe mais pour la couleur qui change au survol ca marche pas pourtant j'ai bien mis la fonction juste avant le </head> et rajouter la ligne de code dans le <area shape>. Ya-t'il un autre moyen? merci beaucoup. > > > > > > > > ------------------------------- > > > > Réponse au message : > > > > ------------------------------- > > > > > > > > > voici la structure de ta page : > > > > > <html>
> > > > >
> > > > > <head>
> > > > > <title>Titre</title>
> > > > >
> > > > > <script language="JavaScript">
> > > > > function survol(objet, type){
> > > > > objet.style.background = (type==0) ? "#FF0000" : "#FFFFFF" ;
> > > > > }
> > > > > function message(){
> > > > > document.getElementById("calque").innerHTML="<b>Code HTML</b>";
> > > > > }
> > > > > </script>
> > > > >
> > > > > </head>
> > > > >
> > > > > <body>
> > > > >
> > > > > <area shape="rect" coords="150,116,220,178" href="#conte" onMouseOver="survol(this, 0)" onMouseOut="survol(this, 1)" onClick="message()">
> > > > >
> > > > > <span id="calque"></span>
> > > > >
> > > > > </body>
> > > > >
> > > > > </html> |
> > > > > > > > > > Houzéf@ - www.123toto.com> > > > > > > > > > > > > > > ------------------------------- > > > > > Réponse au message : > > > > > ------------------------------- > > > > > > > > > > > merci mais j'ai toujours un problème, ta fonction surbol tu la met ou et entre quel balises? > > > > > > merci beaucoup > > > > > > > > > > > > ------------------------------- > > > > > > Réponse au message : > > > > > > ------------------------------- > > > > > > > > > > > > > dans le <area> tu rajoutes : > > > > > > > | onMouseOver="survol(this, 0)" onMouseOut="survol(this, 1)" |
> > > > > > > et tu fais une fonction survol de ce style : > > > > > > > function survol(objet, type){
> > > > > > > objet.style.background = (type==0) ? "#FF0000" : "#FFFFFF" ;
> > > > > > > } |
> > > > > > > > > > > > > > pour ton 2ème pb tu mets des <span> dans ta page (les cellules) et tu utilises des innerHTML : > > > > > > > | <span id="calque"></span> |
> > > > > > > et pour écrire qqchose dans calque : > > > > > > > | document.getElementById("calque").innerHTML="<b>Code HTML</b>"; |
> > > > > > > > > > > > > > Houzéf@ - www.123toto.com> > > > > > > > > > > > > > > > > > > > > ------------------------------- > > > > > > > Réponse au message : > > > > > > > ------------------------------- > > > > > > > > > > > > > > > Bonjour à tous ! > > > > > > > > voila g un problème.J'ai une image sur laquelle j'ai créer des zones reactives. Je voudrais que lorsque je passe la sourie sur ces zones reactives, la couleur de ces zones change. Je voudrais aussi que lorsque je clique sur ces zones reactives un texte s'affiche dans une autre cellule. Un exemple d'une zone reactive : <area shape="rect" coords="150,116,220,178" href="#conte"> > > > > > > > > Comment puis-je faire? > > > > > > > > merci d'avance > > > > > > > > > > > > > > > > ______________________________________________________ > > > > > > > > > > > > > > > > Chaque problème a sa solution, si tu n'en as pas ne t'inquiète pas ca ne change rien au problème.> > > > > > > > > > > > > > > > > > > > > > > > > > > > |
|
dimanche 14 septembre 2003 à 11:42:36 |
Re : carte interactive
Houzefa
|
ah oui si l'image est grande il se peut que ce soit trop long pke a chaque fois qu'on passe la souris sur une zone réactive faut charger l'image, et ca peut etre long selon la taille de l'image. donc pour éviter ca, faut sauver toutes les images qui seront utilisées dans le cache de l'utilisateur. pour cela tu rajoutes dans <body> : et entre <head> et </head> : <script language="JavaScript">
function sauver_images(){
obj_image=new Image();
obj_image.src="image_0.jpg";
obj_image=new Image();
obj_image.src="image_1.jpg";
// ainsi de suite pour sauver chaque image
}
</script> |
Houzéf@ - www.123toto.com------------------------------- Réponse au message : ------------------------------- > merci beaucoup, je vais tester cette solution dès que j'ai le temps. Je pense que ca dvrait marcher. Je te tiendrais informé. encore merci. > > ------------------------------- > Réponse au message : > ------------------------------- > > > dans ce cas g pas trop de réponse... tu ne peux pas changer le contenu d'une image, puisque ce que tu veux faire revient a peu près a untiliser l'outil "pot de peinture" qu'il ya dans les logiciels de dessin. et en javascript c impossible. > > > > par contre ya une solution en PHP, mais assez compliquée : pour chaque zone <area>, PHP génère automatiquement une image différente de l'image de base et la sauve dans un répertoire. ensuite dans le script, faut juste changer l'adresse de l'image chaque fois qu'on survole une <area>. > > > > si ton image ne change pas, tu peux aussi faire ces images toi-meme et les mettre dans un dossier. ensuite le javascript est très simple, suffit de mettre : > > | onMouseOver="document.images [ 0 ] .src='image_1.jpg'" onMouseOut="document.images [ 0 ] .src='image_0.jpg'" |
> > ce code suppose que l'image a changer (celle qui contient l'ensemble des zones réactives) s'appelle image_0.jpg et que lorsqu'on survole une zone faut mettre l'image image_1.jpg. de + faut que ton image soit la 1ère de la page. si c'est par ex la 6ème image de la page, faut mettre un [ 5 ] au lieu du [ 0 ]. > > > > Chaque problème a sa solution, et jcrois bien l'avoir trouvée ! :)> > > > > > Houzéf@ - www.123toto.com> > > > > > ------------------------------- > > Réponse au message : > > ------------------------------- > > > > > Ton script marche très bien avec une image mais il ne marche pas avec une zone interactive de type<area>. En plus je crois que tu n'as pas compris ce que je veux. Ce n'est pas l'arrière plan que je veux changer mails la couleur de la zone interactive qui est sur mon image. Mon image est une carte et il n'ya pas d'arrière plan. Merci quand meme. Si quelqu'un peut m'aidez svp! merci d'avance. > > > > > > ------------------------------- > > > Réponse au message : > > > ------------------------------- > > > > > > > je viens de tester ce code avec une image et ca marche très bien. cependant, il faut bien choisir l'image de laquelle tu veux changer la couleur d'arrière-plan : il faut que ce soit une image gif, avec certaines parties de cette image qui soient transparentes. avec d'autres types d'images non-transparentes, ca peut pas marcher. > > > > > > > > a cette adresse, voila l'icone de mon site, qui est une image gif avec un fond transparent : [ Lien ]> > > > > > > > pour faire un test, remplace : > > > > | <area shape="rect" coords="150,116,220,178" href="#conte" onMouseOver="survol(this, 0)" onMouseOut="survol(this, 1)" onClick="message()"> |
> > > > > > > > par : > > > > | <img src="http://www.123toto.com/icone.gif" href="#" onMouseOver="survol(this, 0)" onMouseOut="survol(this, 1)" onClick="message()"> |
> > > > > > > > Houzéf@ - www.123toto.com> > > > > > > > > > > > ------------------------------- > > > > Réponse au message : > > > > ------------------------------- > > > > > > > > > merci de consacrer un peu de ton temps pour moi mais es-tu sur que ca marche? Chez moi ca ne marche pas et je ne comprend pas pourkoi. Pour afficher un text au click de la sourie jme suis demerdé avec une iframe mais pour la couleur qui change au survol ca marche pas pourtant j'ai bien mis la fonction juste avant le </head> et rajouter la ligne de code dans le <area shape>. Ya-t'il un autre moyen? merci beaucoup. > > > > > > > > > > ------------------------------- > > > > > Réponse au message : > > > > > ------------------------------- > > > > > > > > > > > voici la structure de ta page : > > > > > > <html>
> > > > > >
> > > > > > <head>
> > > > > > <title>Titre</title>
> > > > > >
> > > > > > <script language="JavaScript">
> > > > > > function survol(objet, type){
> > > > > > objet.style.background = (type==0) ? "#FF0000" : "#FFFFFF" ;
> > > > > > }
> > > > > > function message(){
> > > > > > document.getElementById("calque").innerHTML="<b>Code HTML</b>";
> > > > > > }
> > > > > > </script>
> > > > > >
> > > > > > </head>
> > > > > >
> > > > > > <body>
> > > > > >
> > > > > > <area shape="rect" coords="150,116,220,178" href="#conte" onMouseOver="survol(this, 0)" onMouseOut="survol(this, 1)" onClick="message()">
> > > > > >
> > > > > > <span id="calque"></span>
> > > > > >
> > > > > > </body>
> > > > > >
> > > > > > </html> |
> > > > > > > > > > > > Houzéf@ - www.123toto.com> > > > > > > > > > > > > > > > > > ------------------------------- > > > > > > Réponse au message : > > > > > > ------------------------------- > > > > > > > > > > > > > merci mais j'ai toujours un problème, ta fonction surbol tu la met ou et entre quel balises? > > > > > > > merci beaucoup > > > > > > > > > > > > > > ------------------------------- > > > > > > > Réponse au message : > > > > > > > ------------------------------- > > > > > > > > > > > > > > > dans le <area> tu rajoutes : > > > > > > > > | onMouseOver="survol(this, 0)" onMouseOut="survol(this, 1)" |
> > > > > > > > et tu fais une fonction survol de ce style : > > > > > > > > function survol(objet, type){
> > > > > > > > objet.style.background = (type==0) ? "#FF0000" : "#FFFFFF" ;
> > > > > > > > } |
> > > > > > > > > > > > > > > > pour ton 2ème pb tu mets des <span> dans ta page (les cellules) et tu utilises des innerHTML : > > > > > > > > | <span id="calque"></span> |
> > > > > > > > et pour écrire qqchose dans calque : > > > > > > > > | document.getElementById("calque").innerHTML="<b>Code HTML</b>"; |
> > > > > > > > > > > > > > > > Houzéf@ - www.123toto.com> > > > > > > > > > > > > > > > > > > > > > > > ------------------------------- > > > > > > > > Réponse au message : > > > > > > > > ------------------------------- > > > > > > > > > > > > > > > > > Bonjour à tous ! > > > > > > > > > voila g un problème.J'ai une image sur laquelle j'ai créer des zones reactives. Je voudrais que lorsque je passe la sourie sur ces zones reactives, la couleur de ces zones change. Je voudrais aussi que lorsque je clique sur ces zones reactives un texte s'affiche dans une autre cellule. Un exemple d'une zone reactive : <area shape="rect" coords="150,116,220,178" href="#conte"> > > > > > > > > > Comment puis-je faire? > > > > > > > > > merci d'avance > > > > > > > > > > > > > > > > > > ______________________________________________________ > > > > > > > > > > > > > > > > > > Chaque problème a sa solution, si tu n'en as pas ne t'inquiète pas ca ne change rien au problème.> > > > > > > > > > > > > > > > > > > > > > > > > > > > > > > > > > > > |
|
Cette discussion est classée dans : problème, zones, carte, interactive, reactives
 Répondre à ce message
 Sujets en rapport avec ce message
carte dynamique [ par missmaroc ]
Bonjour J ai une carte de paris divisée en Zone elle en a 37; insérée avec cette syntaxe : . avec les zones de types polyg
changement de couleur sur zones reactives [ par hos ]
Bonjour,Voila , j'ai un plan de ville(22ko) avec 4 zones reactives de couleurs différentes (4 quartiers) et je voudrais lors d'un passage de souris su
Problème de péplacement de calque dans une application de carte [ par akiko ]
Avant toute chose bonjour et merci d'avance d'avoir ou de prendre le temps de lire le contenu de mon problème... je travaille actuellement sur une ap
Déroulement de Checkbox cachées [ par wowitta ]
Bonjour,Mon problème est le suivant:J'ai créé 4 checkbox principales et pour chacune une dizaine de checkbox secondaires qui sont cachées. Cela marche
Devis a partir d'une carte cliquable [ par jpdollo ]
Bonjour Je suis debutant Je voudrais realiser un formulaire de devis a partir d'une carte cliquable: Je clique sur une ville, 4 autres s'inscrivent su
Problème de traduction [ par rs9000 ]
Bonjour à tous,Je l'administrateur d'un forum dont voici le lien : http://kawasaki-1700-voyage.forumactif.com/index.htm<p class="
zone reactive et pop up [ par veinerd ]
bon ben je ne sais plus coment fairehttp://www.cafe-sushi.fr/carte.htmc'est le projet que je dois realiser pour ecole en alternance donc j'ai le contr
Problème avec setInterval [ par VirusB ]
Bonjour, j'aimerais savoir pourquoi ce code ne fonctionne pas.setInterval(, 3000);</scr
Problème d'impression des couleurs de la page [ par JulianRenan ]
Bonjour à tous,Dans une page j'ai créé un tableau avec un background noir et divers inputs avec également différentes couleurs en background.Quand je
Menu déroulant [ par artax1977 ]
Bonjour à tous,Tout d'abord tous mes meilleurs voeux pour l'année nouvelle...J'utilise le script "javascriptfr_MENU-DEROULANT". C'était absolument cec
 Livres en rapport
|
Derniers Blogs
 [RIA SERVICES] INCLUDE ET DOMAINDATASOURCE[RIA SERVICES] INCLUDE ET DOMAINDATASOURCE par Audrey
Dans un de mes articles précédents , j'avais parlé des DomainDataSource avec RIA Services dans le cas d'une interface Maître - Détail. Dans le même principe, je vais parler d'une autre manière de mettre en forme ce cas d'interface avec RIA Services. Et po...
Cliquez pour lire la suite de l'article par Audrey ZUNE : VERSION ZUNE SOFTWARE V 4.2 ET LA SOCIALISATIONZUNE : VERSION ZUNE SOFTWARE V 4.2 ET LA SOCIALISATION par ROMELARD Fabrice
Une des nouveautés de la version V 3.0 était l'apparition de l'onglet Social qui ne fonctionnait que si le MarketPlace était activé sur son poste. Cela limitait donc son intérêt, car hors du cadre commercial USA-CANADA, peu de monde trouva...
Cliquez pour lire la suite de l'article par ROMELARD Fabrice PRATIQUE DE SILVERLIGHT PAR ERIC AMBROSIPRATIQUE DE SILVERLIGHT PAR ERIC AMBROSI par MPOWARE
Je viens de finir la lecture du dernier livre d'
Eric Ambrosi
éditions PEARSON
Son livre donne une approche pratique de Silverlight qui sera aussi bien comprise par le développeur que par le designeur.
Tous les aspects du développement RIA sont abor...
Cliquez pour lire la suite de l'article par MPOWARE APPRENDRE à DéVELOPPER POUR LES MOBILES AVEC LA NOUVELLE GéNéRATION .NETAPPRENDRE à DéVELOPPER POUR LES MOBILES AVEC LA NOUVELLE GéNéRATION .NET par odewit
2 déclinaisons de Silverlight et 2 déclinaisons de Mono permettent dorénavant (ou permettront prochainement) de développer des applications .NET mobiles pour les principales plates-formes du marché :
Silverlight pour Symbian, basé sur Silverlight 2...
Cliquez pour lire la suite de l'article par odewit ZUNE : NOUVELLE VERSION DU ZUNE SOFTWARE - V 4.2ZUNE : NOUVELLE VERSION DU ZUNE SOFTWARE - V 4.2 par ROMELARD Fabrice
Avec la dernière génération du lecteur MP3 de Microsoft, le ZUNE HD, Microsoft a publié une nouvelle version du logiciel pour PC. Ainsi, je me suis décidé à installer celle-ci sur mon Tablet PC ACER, comme toujours le logiciel est donc tél...
Cliquez pour lire la suite de l'article par ROMELARD Fabrice
Forum
 RE : CONVERSIONRE : CONVERSION par peter2010
Cliquez pour lire la suite par peter2010
Logiciels
 Academy System (10.9.4.0)ACADEMY SYSTEM (10.9.4.0)Logiciel de gestion des établissements.
- élèves/étudiants (inscription, dossier, absence...)
-... Cliquez pour télécharger Academy System Xilisoft Convertisseur Vidéo Ultimate (5.1.39.0305)XILISOFT CONVERTISSEUR VIDéO ULTIMATE (5.1.39.0305)Xilisoft Convertisseur Vidéo Ultimate est un outil puissant de conversion vidéo, facile à utilise... Cliquez pour télécharger Xilisoft Convertisseur Vidéo Ultimate Xilisoft DVD Ripper Ultimate (5.0.64.0304)XILISOFT DVD RIPPER ULTIMATE (5.0.64.0304)Xilisoft DVD Ripper Ultimate est un logiciel excellent pour copier et convertir DVD vers presque ... Cliquez pour télécharger Xilisoft DVD Ripper Ultimate Rigs of Rods (63.3)RIGS OF RODS (63.3)c'est un jeu de multi-simulation camions,autobus voitures, avions, bateaux, hélicoptère avec défo... Cliquez pour télécharger Rigs of Rods
|