Carte interactive

4 participants

Voir le sujet précédent Voir le sujet suivant Aller en bas

Résolu Carte interactive

Message par Maitre Orion Dim 18 Aoû 2013 - 14:28

Bonjour j'aurais besoin d'une grande aide, j'aimerais faire une carte interactive.


J'ai le HTML
Code:

<script>
function showtip(tag){
killtip();
$(".tip"+tag).attr("id","tipshowed");
}
function killtip() { $("#tipshowed").removeAttr("id"); }
</script>
<div id="carte_fond">
<p class="titre_carte"> Carte interactive de Gwendalavir : </p>
<p class="text_carte">
Pour profiter pleinement des fonctionnalités de la page, merci d'activer
<b>JavaScript</b>
</p>
<br>
<div class="tipps tipcitadelle">
<h2>Citadelle des Frontaliers</h2>
<b>
<u>Climat :</u>
</b>
Nordique.
<br>
<b>
<u>Flore :</u>
</b>
Plaines avec quelques petits bosquets.
<br>
<b>
<u>Faune :</u>
</b>
Tigres des praires et animaux communs.
</div>
<div class="tipps tipnimurdes">
<h2>Île des Nimurdes</h2>
<b>
<u>Climat :</u>
</b>
Nordique, toujours froid et venteux.
<br>
<b>
<u>Flore :</u>
</b>
Des amas rocheux et un paysage chaotique, en bordure d’Océan.
<br>
<b>
<u>Faune :</u>
</b>
Officiellement, petits rongeurs et autres mammifères.
</div>
<div class="tipps tipgeants">
<h2>Septentrion des Géants</h2>
<b>
<u>Climat :</u>
</b>
Nordique, froid et venteux.
<br>
<b>
<u>Faune :</u>
</b>
On dit que les Géants habitent cette région du continent…
<br>
<b>
<u>Flore :</u>
</b>
Roches et pins se mélangent avec ravissement le long des criques de la côte.
</div>
<div class=" tipps tiproyrai">
<h2>Royaume Raï</h2>
<b>
<u>Climat :</u>
</b>
Variable - Froid au Nord, assez continental autour du volcan et des plaines de Kur N’Raï, marécageux et limoneux.
<br>
<b>
<u>Faune :</u>
</b>
Animaux sauvages ongulés ; Hordes de Raï ; Soupçon d’habitat des Ts’liches.
<br>
<b>
<u>Flore :</u>
</b>
Variable – Montagnes au Nord, plaines dans le centre, marécages à l’Ouest.
</div>
<div class="tipps tipankai">
<h2>Marais d'Ankaï</h2>
<b>
<u>Climat :</u>
</b>
Equatorial - marécageux.
<br>
<b>
<u>Faune :</u>
</b>
Animaux sauvages ongulés, Trodds.
<br>
<b>
<u>Flore :</u>
</b>
Marécages et mangroves.
</div>
<div class="tipps tipkurnrai">
<h2>Kur N'Raï</h2>
" Capitale " des hordes Raïs.
</div>
<div class="tipps tippetits">
<h2>Forêt Maison des Petits</h2>
<b>
<u>Climat :</u>
</b>
Tropical.
<br>
<b>
<u>Faune :</u>
</b>
Petits animaux arboricoles. Trodds et Ours élastiques. Habitat des Petits.
<br>
<b>
<u>Flore :</u>
</b>
Immenses arbres centenaires dans une jungle majestueuse et étendue.
</div>
<div class="tipps tipotolep">
<h2>L'Oeil d'Otolep</h2>
<b>
<u>Climat :</u>
</b>
Océanique.
<br>
<b>
<u>Faune :</u>
</b>
Petits animaux. Les animaux malveillants (Ts’Liches, Brûleurs et Goules) ne peuvent pas s’en approcher.
<br>
<b>
<u>Flore :</u>
</b>
Herbes rases à des kilomètres, sur des plaines qui l’entourent.
</div>
<div class="tipps tipchainepoll">
<h2>Chaîne du Poll</h2>
<b>
<u>Climat :</u>
</b>
Montagneux.
<br>
<b>
<u>Faune :</u>
</b>
Animaux de la montagne
<br>
<b>
<u>Flore :</u>
</b>
Pas grand-chose, mis à part des pins rachitiques et une herbe rare.
</div>
<div class="tipps tipfrontieres">
<h2>Frontières de Glace</h2>
<b>
<u>Climat :</u>
</b>
Montagneux, Nordique.
<br>
<b>
<u>Faune :</u>
</b>
Petits animaux de la montagne.
<br>
<b>
<u>Flore :</u>
</b>
Pins, rare herbe, buissons montagneux.
</div>
<div class="tipps tipmarchesnord">
<h2>Les Marches du Nord</h2>
<b>
<u>Climat :</u>
</b>
Nordique / Montagnard.
<br>
<b>
<u>Faune :</u>
</b>
Animaux du continent.
<br>
<b>
<u>Flore :</u>
</b>
Plaines encerclées de hautes montagnes.
</div>
<div class="tipps tipastariul">
<h2>Plateaux d'Astariul</h2>
<b>
<u>Climat :</u>
</b>
Continental, landais.
<br>
<b>
<u>Faune :</u>
</b>
Grands prédateurs ( tigres des prairies, ours…), Brûleurs, Goules, et autres petits mammifères.
<br>
<b>
<u>Flore :</u>
</b>
Plaines et collines aux broussailles multiples. Flore qui peut sembler agressive et aux couleurs beiges et claires.
</div>
<div class="tipps tipalpoll">
<h2>Al-Poll</h2>
<b>
<u>Climat :</u>
</b>
Nordique.
<br>
<b>
<u>Architecture :</u>
</b>
Ville souterraine. Architecture chaotique et plutôt baroque, imaginée par les Dessinateurs.
<br>
<b>
<u>Classement des plus grandes villes :</u>
</b>
2ème
</div>
<div class="tipps tipalfar">
<h2>Al-Far</h2>
<b>
<u>Climat :</u>
</b>
Continental.
<br>
<b>
<u>Architecture :</u>
</b>
Baroque et classique savamment mélangées.
<br>
<b>
<u>Classement des plus grandes villes :</u>
</b>
4ème (1ère par le nombre de crimes)
</div>
<div class="tipps tiptintiane">
<h2>Tintiane</h2>
Confrérie de Rêveurs
</div>
<div class="tipps tipbarail">
<h2>Forêt de Baraïl</h2>
<b>
<u>Climat :</u>
</b>
Continental.
<br>
<b>
<u>Faune :</u>
</b>
Animaux sylvestres.
<br>
<b>
<u>Flore :</u>
</b>
Vivace et dense. Grands arbres, qui deviennent plus vieux vers les falaises menant au pays Faël.
</div>
<div class="tipps tipfael">
<h2>Pays Faël</h2>
<b>
<u>Climat :</u>
</b>
Méditerranéen.
<br>
<b>
<u>Faune :</u>
</b>
Peu connue car peu explorée. Habitat des Faëls.
<br>
<b>
<u>Flore :</u>
</b>
Peu connue car peu explorée.
</div>
<div class="tipps tipombreuse">
<h2>Forêt Ombreuse</h2>
<b>
<u>Climat :</u>
</b>
Continental.
<br>
<b>
<u>Faune :</u>
</b>
Grands prédateurs félins, Brûleurs, Goules et autres animaux plus communs.
<br>
<b>
<u>Flore :</u>
</b>
Diverse.
</div>
<div class="tipps tiplachen">
<h2>Lac Chen</h2>
Immense lac – ou mer intérieure, selon les sources – aux fonds insondables.
<br>
<b>
<u>Faune :</u>
</b>
Les Dames peuvent y remonter depuis l’Océan.
</div>
<div class="tipps tipdentelles">
<h2>Dentelles Vives</h2>
<b>
<u>Climat :</u>
</b>
Montagnard.
<br>
<b>
<u>Faune :</u>
</b>
Animaux de la montagne et des hauteurs.
<br>
<b>
<u>Flore :</u>
</b>
Peu, quelques pins des hauteurs.
</div>
<div class="tipps tipest">
<h2>Plateaux et Montagnes de l'Est</h2>
<b>
<u>Climat :</u>
</b>
Continental.
<br>
<b>
<u>Faune :</u>
</b>
Céréales sauvages, plaines arides et montagnes rocheuses.
<br>
<b>
<u>Flore :</u>
</b>
Grands prédateurs félins, loups, et autres animaux communs.
</div>
<div class="tipps tipalchen">
<h2>Al-Chen</h2>
<b>
<u>Climat :</u>
</b>
Méditerranéen.
<br>
<b>
<u>Architecture :</u>
</b>
Baroque et classique savamment mélangées.
<br>
<b>
<u>Classement des plus grandes villes :</u>
</b>
3ème
</div>
<div class="tipps tipferiane">
<h2>Fériane</h2>
Confrérie de Rêveurs
</div>
<div class="tipps tipaljeit">
<h2>Al-Jeit</h2>
<b>
<u>Climat :</u>
</b>
Continental.
<br>
<b>
<u>Architecture :</u>
</b>
Innovante et multicolore ; créée entièrement par des Dessinateurs.
<br>
<b>
<u>Classement des plus grandes villes :</u>
</b>
1ère - CAPITALE
</div>
<div class="tipps tipdesert">
<h2>Désert des Murmures</h2>
<b>
<u>Climat :</u>
</b>
Désertique.
<br>
<b>
<u>Faune :</u>
</b>
Ijakhis et animaux vivants dans les déserts.
<br>
<b>
<u>Flore :</u>
</b>
Aucune.
</div>
<div class="tipps tipfaille">
<h2>La Grande Faille</h2>
<b>
<u>Climat :</u>
</b>
Tropical.
<br>
<b>
<u>Faune :</u>
</b>
Poissons et petits animaux.
<br>
<b>
<u>Flore :</u>
</b>
Espèces végétales tropicales ; la Voleuse la traverse de part en part.
</div>
<div class="tipps tippollimage">
<h2>Le Pollimage</h2>
Fleuve le plus long et le plus large de l’Empire, beaucoup utilisé par la navigation.
</div>
<div class="tipps tiparche">
<h2>L'Arche</h2>
Immense pont de verre créé par les Dessinateurs au-dessus du Pollimage.
</div>
<div class="tipps tipgoule">
<h2>La Passe de la Goule</h2>
<b>
<u>Climat :</u>
</b>
Continental.
<br>
<b>
<u>Faune :</u>
</b>
Plaines plutôt arides.
<br>
<b>
<u>Flore :</u>
</b>
Goules et grands prédateurs félins, loups et autres animaux communs.
</div>
<div class="tipps tiptaj">
<h2>Collines de Taj</h2>
<b>
<u>Climat :</u>
</b>
Aride.
<br>
<b>
<u>Faune :</u>
</b>
Grands prédateurs félins, Brûleurs, petits mammifères.
<br>
<b>
<u>Flore :</u>
</b>
Plaines et collines plutôt arides.
</div>
<div class="tipps tipondiane">
<h2>Ondiane</h2>
Confrérie de Rêveurs.
</div>
<div class="tipps tipalvor">
<h2>Al-Vor</h2>
<b>
<u>Climat :</u>
</b>
Aride.
<br>
<b>
<u>Architecture :</u>
</b>
Baroque.
<br>
<b>
<u>Classement des plus grandes villes :</u>
</b>
5ème.
</div>
<div class="tipps tipoceans">
<h2>Grands Océans</h2>
<b>
<u>Climat :</u>
</b>
Océanique.
<br>
<b>
<u>Faune :</u>
</b>
Petits animaux vivant près des côtes.
<br>
<b>
<u>Flore :</u>
</b>
Pinèdes et landes.
</div>
<div class="tipps tipalines">
<h2>Archipels Alines</h2>
<b>
<u>Climat :</u>
</b>
Océanique.
<br>
<b>
<u>Faune :</u>
</b>
Variable.
<br>
<b>
<u>Flore :</u>
</b>
Petites îles dispersées dans l’Océan, aux écosystèmes variables.
</div>
<div class="tipps tiphulm">
<h2>Jungle d'Hulm</h2>
<b>
<u>Climat :</u>
</b>
Tropical.
<br>
<b>
<u>Faune :</u>
</b>
Ours élastiques, autres animaux communs..
<br>
<b>
<u>Flore :</u>
</b>
Espèces végétales tropicales.
</div>
<div class="tipps tiplacchen">
<h2>Lac Chen</h2>
<b>
<u>Climat :</u>
</b>
Méditerranéen.
<br>
<b>
<u>Flore : </u>
</b>
Marais et plages.
<br>
<b>
<u>Faune : </u>
</b>
Aquatique. Parfois, des Dames s'y trouvent.
</div>
<img width="850" height="1338" border="0" usemap="#map" src="http://img822.imageshack.us/img822/3310/cartefinal.png">
<map name="map">
<area onmouseout="killtip()" onmouseover="showtip('nimurdes')" href="http://ecoledesmarchombres.1fr1.net/f127-ile-des-nimurdes" coords="264,95,285,74,313,73,340,90,346,125,346,154,334,160,339,182,339,206,330,225,351,201,362,218,330,232,293,238,247,174,259,127,236,129,235,149,219,136,234,109,248,95,266,103" shape="poly">
<area onmouseout="killtip()" onmouseover="showtip('geants')" href="http://ecoledesmarchombres.1fr1.net/f128-septentrion-des-geants" coords="503,55,477,107,454,120,455,160,420,160,420,179,386,205,372,232,365,256,352,274,306,300,270,321,255,366,245,407,284,401,331,353,401,339,492,327,560,331,593,331,566,299,585,284,589,260,570,219,554,228,554,188,545,167,520,202,515,175,524,152,524,117,508,101,506,69" shape="poly">
<area onmouseout="killtip()" onmouseover="showtip('royrai')" href="http://ecoledesmarchombres.1fr1.net/f121-royaume-rai" coords="329,288,446,290,566,290,583,354,626,425,663,460,639,525,574,553,465,567,526,575,402,574,354,551,309,519,282,480,253,443,246,395,248,352,275,319" shape="poly">
<area onmouseout="killtip()" onmouseover="showtip('ankai')" href="http://ecoledesmarchombres.1fr1.net/f123-marais-d-ankai" coords="256,490,315,527,421,586,424,632,397,668,346,666,308,635,273,620,229,591,207,585,235,554" shape="poly">
<area onmouseout="killtip()" onmouseover="showtip('kurnrai')" href="http://ecoledesmarchombres.1fr1.net/f122-kur-n-rai" coords="425,582,426,631,450,661,518,640,526,602,526,588,463,582" shape="poly">
<area onmouseout="killtip()" onmouseover="showtip('petits')" href="http://ecoledesmarchombres.1fr1.net/f129-foret-maison-des-petits" coords="173,633,224,615,293,640,322,656,323,682,290,697,249,710,211,721,181,686,164,650" shape="poly">
<area onmouseout="killtip()" onmouseover="showtip('otolep')" href="http://ecoledesmarchombres.1fr1.net/f41-l-oeil-d-otolep" coords="589,579,669,547,701,575,728,605,728,637,706,641,683,658,673,697,657,734,640,769,599,788,609,749,590,708,566,695,580,605,583,588" shape="poly">
<area onmouseout="killtip()" onmouseover="showtip('chainepoll')" href="http://ecoledesmarchombres.1fr1.net/f36-chaine-du-poll" coords="277,732,315,700,361,691,409,691,441,724,446,734,406,745,362,741,335,728,302,727,293,729" shape="poly">
<area onmouseout="killtip()" onmouseover="showtip('frontieres')" href="http://ecoledesmarchombres.1fr1.net/f38-frontieres-de-glace" coords="411,688,413,678,470,671,542,682,543,701,528,714,488,727,460,731,444,731,432,711" shape="poly">
<area onmouseout="killtip()" onmouseover="showtip('citadelle')" href="http://ecoledesmarchombres.1fr1.net/f37-citadelle-des-frontaliers" coords="366,753,456,740,556,720,587,735,590,770,555,791,478,792,420,793,386,773" shape="poly">
<area onmouseout="killtip()" onmouseover="showtip('marchesnord')" href="http://ecoledesmarchombres.1fr1.net/f160-les-marches-du-nord" coords="367,755,354,820,347,911,345,947,387,921,439,881,498,846,552,834,518,801,404,796,388,781" shape="poly">
<area onmouseout="killtip()" onmouseover="showtip('astariul')" href="http://ecoledesmarchombres.1fr1.net/f39-plateaux-d-astariul" coords="242,766,365,770,347,829,337,894,336,940,326,940,320,921,257,930,248,912,302,900,328,873,321,856,256,859,226,863,214,830,224,781" shape="poly">
<area onmouseout="killtip()" onmouseover="showtip('alpoll')" href="http://ecoledesmarchombres.1fr1.net/f33-al-poll" coords="263,733,261,760,358,769,361,754,336,747,293,736" shape="poly">
<area onmouseout="killtip()" onmouseover="showtip('alfar')" href="http://ecoledesmarchombres.1fr1.net/f31-al-far" coords="222,885,313,879,296,899,254,905,217,923,217,913" shape="poly">
<area onmouseout="killtip()" onmouseover="showtip('tintiane')" href="http://ecoledesmarchombres.1fr1.net/f40-tintiane" coords="234,865,278,860,315,862,325,876,240,879,234,878,233,878,243,871" shape="poly">
<area onmouseout="killtip()" onmouseover="showtip('barail')" href="http://ecoledesmarchombres.1fr1.net/f43-foret-de-barail" coords="211,808,156,906,135,970,147,1021,178,1048,178,1094,179,1147,184,1165,206,1073,229,1028,223,994,204,974,203,926,209,881,209,856" shape="poly">
<area onmouseout="killtip()" onmouseover="showtip('fael')" href="http://ecoledesmarchombres.1fr1.net/f44-pays-fael" coords="119,674,207,736,207,789,190,834,150,914,122,986,151,1041,163,1074,169,1159,155,1109,125,1123,122,1166,126,1182,90,1136,61,1077,54,1003,57,933,63,891,73,822,97,817,123,810,108,748,106,712" shape="poly">
<area onmouseout="killtip()" onmouseover="showtip('ombreuse')" href="http://ecoledesmarchombres.1fr1.net/f42-foret-ombreuse" coords="232,954,285,932,324,929,308,976,307,1007,249,993,236,985" shape="poly">
<area onmouseout="killtip()" onmouseover="showtip('lacchen')" href="http://ecoledesmarchombres.1fr1.net/f50-lac-chen" coords="329,945,365,945,370,968,360,998,330,999,320,992,319,968" shape="poly">
<area onmouseout="killtip()" onmouseover="showtip('dentelles')" href="http://ecoledesmarchombres.1fr1.net/f51-dentelles-vives" coords="330,999,312,1055,308,1096,325,1112,330,1088,335,1037,346,1011,349,1005" shape="poly">
<area onmouseout="killtip()" onmouseover="showtip('est')" href="http://ecoledesmarchombres.1fr1.net/f46-plateaux-et-montagnes-de-l-est" coords="367,939,473,873,546,852,585,839,528,920,594,829,638,835,682,868,698,891,654,877,597,879,577,919,557,940,519,960,533,984,521,1018,506,996,457,986,434,968,383,956,361,944,363,942" shape="poly">
<area onmouseout="killtip()" onmouseover="showtip('alchen')" href="http://ecoledesmarchombres.1fr1.net/f30-al-chen" coords="372,956,368,982,424,983,429,973,386,962" shape="poly">
<area onmouseout="killtip()" onmouseover="showtip('feriane')" href="http://ecoledesmarchombres.1fr1.net/f49-feriane" coords="421,992,487,995,491,1015,477,1029,422,1011" shape="poly">
<area onmouseout="killtip()" onmouseover="showtip('aljeit')" href="http://ecoledesmarchombres.1fr1.net/f32-al-jeit" coords="424,1067,424,1091,478,1093,512,1080,503,1062,469,1062" shape="poly">
<area onmouseout="killtip()" onmouseover="showtip('desert')" href="http://ecoledesmarchombres.1fr1.net/f53-desert-des-murmures" coords="542,959,628,954,589,973,586,990,634,972,685,974,721,974,681,1009,690,1039,690,1084,683,1111,670,1174,658,1186,586,1172,559,1129,507,1104,510,1086,523,1034,538,976" shape="poly">
<area onmouseout="killtip()" onmouseover="showtip('faille')" href="http://ecoledesmarchombres.1fr1.net/f54-la-grande-faille" coords="696,899,641,954,602,975,669,967,734,967,776,962,774,939,767,912,729,902" shape="poly">
<area onmouseout="killtip()" onmouseover="showtip('pollimage')" href="http://ecoledesmarchombres.1fr1.net/f125-le-pollimage" coords="349,1007,357,1030,376,1046,394,1052,410,1041,411,1026,393,1006,364,989,375,989" shape="poly">
<area onmouseout="killtip()" onmouseover="showtip('arche')" href="http://ecoledesmarchombres.1fr1.net/f126-l-arche" coords="378,1050,419,1043,465,1039,483,1056,437,1061,415,1065,416,1081,386,1082,371,1087,373,1067" shape="poly">
<area onmouseout="killtip()" onmouseover="showtip('goule')" href="http://ecoledesmarchombres.1fr1.net/f124-la-passe-de-la-goule" coords="346,1016,340,1045,334,1093,336,1113,347,1131,347,1146,367,1128,381,1103,369,1088,371,1051,356,1036" shape="poly">
<area onmouseout="killtip()" onmouseover="showtip('taj')" href="http://ecoledesmarchombres.1fr1.net/f47-collines-de-taj" coords="229,993,271,1002,308,1017,306,1050,289,1061,300,1074,302,1097,286,1113,276,1090,276,1077,264,1059,240,1056,226,1069,235,1033,234,1015" shape="poly">
<area onmouseout="killtip()" onmouseover="showtip('ondiane')" href="http://ecoledesmarchombres.1fr1.net/f48-ondiane" coords="248,1063,217,1076,227,1096,261,1091,270,1087,274,1078,262,1065" shape="poly">
<area onmouseout="killtip()" onmouseover="showtip('alvor')" href="http://ecoledesmarchombres.1fr1.net/f136-al-vor" coords="209,1091,204,1113,249,1112,281,1110,271,1094,241,1102,216,1093" shape="poly">
<area onmouseout="killtip()" onmouseover="showtip('oceans')" href="http://ecoledesmarchombres.1fr1.net/f215-les-grands-oceans" coords="201,1115,193,1149,187,1195,238,1234,328,1231,447,1234,480,1212,467,1176,437,1131,427,1096,388,1097,370,1143,331,1137,330,1122,307,1126,275,1119,259,1119" shape="poly">
<area onmouseout="killtip()" onmouseover="showtip('alines')" href="http://ecoledesmarchombres.1fr1.net/f52-archipel-alines" coords="470,1098,468,1131,480,1187,442,1253,403,1254,377,1324,557,1323,534,1252,524,1153,517,1118,506,1100" shape="poly">
<area onmouseout="killtip()" onmouseover="showtip('hulm')" href="http://ecoledesmarchombres.1fr1.net/f45-jungle-d-hulm" coords="670,884,617,876,593,907,554,940,528,958,569,958,640,945,690,900,681,897" shape="poly">
</map>
</div>
</td>
le CSS
Code:
.titre_carte {
    color: #9B0000;
    font-size: 2em;
    font-variant: small-caps;
    font-weight: 700;
    text-decoration: underline;
}
.text_carte {
    font-size: 0.7em;
    font-style: italic;
}
#carte_fond {
    margin: 20px 15px 30px 10px;
    padding-bottom: 15px;
    padding-left: 15px;
    padding-right: 15px;
}
#carte_fond img {
    border-radius: 10px 10px 10px 10px;
    box-shadow: 1px 1px 2px #000000;
}
#tipshowed {
    background-color: #D1E5AB;
    border: 1px solid #4E4E4E;
    border-radius: 12px 12px 12px 12px;
    box-shadow: 1px 1px 2px #000000;
    color: #616161;
    display: inline;
    font-size: 0.7em;
    left: 250px;
    padding-bottom: 15px;
    padding-left: 9px;
    padding-right: 9px;
    position: fixed;
    text-align: justify;
    top: 250px;
    visibility: visible;
    width: 250px;
    z-index: 999;
}
.tipps {
    display: none;
}
Ce que je ne comprend pas c'est qu'est-ce que ceci :

Code:
<script>
function showtip(tag){
killtip();
$(".tip"+tag).attr("id","tipshowed");
}
function killtip() { $("#tipshowed").removeAttr("id"); }
</script>
Et y aurait il un Javascript pour tout ça ?


Merci d'avance à tous !
Orion


Dernière édition par Maitre Orion le Ven 23 Aoû 2013 - 21:37, édité 1 fois
Maitre Orion

Maitre Orion
****

Masculin
Messages : 491
Inscrit(e) le : 19/08/2009

http://portedesmondes.1fr1.net
Maitre Orion a été remercié(e) par l'auteur de ce sujet.

Résolu Re: Carte interactive

Message par Self Dim 18 Aoû 2013 - 14:37

Maitre Orion a écrit:Bonjour j'aurais besoin d'une grande aide, j'aimerais faire une carte interactive.

Ce que je ne comprend pas c'est qu'est-ce que ceci :

Code:
<script>
function showtip(tag){
killtip();
$(".tip"+tag).attr("id","tipshowed");
}
function killtip() { $("#tipshowed").removeAttr("id"); }
</script>
Et y aurait il un Javascript pour tout ça ?


Merci d'avance à tous !
Orion
Bonjour ^^.
Ceci c'est un javascript entouré de balise mauvaise pour la première.
Essayez de le remplacé par:
Code:
<script type="text/javascript">
function showtip(tag){
killtip();
$(".tip"+tag).attr("id","tipshowed");
}
function killtip() { $("#tipshowed").removeAttr("id"); }
</script>
Cordialement Smile .
Self

Self
Membre actif

Masculin
Messages : 3853
Inscrit(e) le : 13/06/2013

https://selfback.forumactif.com/
Self a été remercié(e) par l'auteur de ce sujet.

Résolu Re: Carte interactive

Message par Maitre Orion Dim 18 Aoû 2013 - 16:00

Malheureusement j'ai bien évidement changé ceci déjà, ça ne marche pas mieux !
Maitre Orion

Maitre Orion
****

Masculin
Messages : 491
Inscrit(e) le : 19/08/2009

http://portedesmondes.1fr1.net
Maitre Orion a été remercié(e) par l'auteur de ce sujet.

Résolu Re: Carte interactive

Message par Adam_sfp Dim 18 Aoû 2013 - 17:03

Bonjour

Si vous utilisez ce code en page d'accueil remplacez $ par jQuery.
Code:
    <script>
    function showtip(tag){
    killtip();
    jQuery(".tip"+tag).attr("id","tipshowed");
    }
    function killtip() { jQuery("#tipshowed").removeAttr("id"); }
    </script>
le code fonctionne sinon.

Cdt.
Adam_sfp

Adam_sfp
Membre actif

Masculin
Messages : 4465
Inscrit(e) le : 18/04/2008

http://antonyadam.kanak.fr
Adam_sfp a été remercié(e) par l'auteur de ce sujet.

Résolu Re: Carte interactive

Message par Maitre Orion Dim 18 Aoû 2013 - 17:08

en fait j'aimerais le mettre dans un sujet.

Donc dans un post avec juste la carte et quand je passe mon curseur dessus ça fait comme

j'ai installer le CSS, mais je pense qu'il manque un truc parce que ça me fait ça :

Carte interactive 42865
Maitre Orion

Maitre Orion
****

Masculin
Messages : 491
Inscrit(e) le : 19/08/2009

http://portedesmondes.1fr1.net
Maitre Orion a été remercié(e) par l'auteur de ce sujet.

Résolu Re: Carte interactive

Message par Maitre Orion Lun 19 Aoû 2013 - 23:23

Up !
Maitre Orion

Maitre Orion
****

Masculin
Messages : 491
Inscrit(e) le : 19/08/2009

http://portedesmondes.1fr1.net
Maitre Orion a été remercié(e) par l'auteur de ce sujet.

Résolu Re: Carte interactive

Message par Maitre Orion Mer 21 Aoû 2013 - 2:18

Up !
Maitre Orion

Maitre Orion
****

Masculin
Messages : 491
Inscrit(e) le : 19/08/2009

http://portedesmondes.1fr1.net
Maitre Orion a été remercié(e) par l'auteur de ce sujet.

Résolu Re: Carte interactive

Message par Neptunia Mer 21 Aoû 2013 - 2:37

Bonsoir !

Le tutoriel sur les images réactives est ici
-> Créer une image réactive
Neptunia

Neptunia
Membre actif

Féminin
Messages : 17853
Inscrit(e) le : 08/08/2010

https://www.galaxie-series.net/
Neptunia a été remercié(e) par l'auteur de ce sujet.

Voir le sujet précédent Voir le sujet suivant Revenir en haut

- Sujets similaires

Permission de ce forum:
Vous ne pouvez pas répondre aux sujets dans ce forum