| Problème lien sur carte réactive en SVG et JS/HTML [RESOLU] | |
|
Akya
{ Membre }
Messages : 207
| Bonjour,
Mon problème est à mon avis très simple, mais je ne parviens pas à le résoudre seule. J'ai cherché à suivre ce tuto : http://proov.fr/html/creer-une-carte-de-france-cliquable-en-html5-svg/
Malgré l'explication pour faire un lien sur chaque département, j'ai voulu essayé de le faire pour l'Ain & l'Aisne, mais rien à faire, ça ne fonctionne pas. Il ne se passe rien quand je clique. Voici le script concerné, où tout se passe :
(Sous hide)
La page en question : (Sous hide)
Les titles des liens apparaissent bien, mais rien ne se passe quand on clique...
Merci d'avance pour l'aide apportée. |
Dernière édition par Akya le Jeu 27 Mar 2014, 16:09, édité 3 fois | |
|
| |
Nihil
{ Modérateur }
Messages : 1216
| Je poste pour avoir accès au contenu sous hide (: | | |
|
| |
Akya
{ Membre }
Messages : 207
| J'avais comme une intuition comme quoi ce serait toi qui me viendrait en aide. xD Merci beaucoup ! En espérant qu'on trouve une solution parce que depuis le temps où je suis dessus... | | |
|
| |
Nihil
{ Modérateur }
Messages : 1216
| Quand on regarde le code généré par je JS, pour l'Aisne on a à l'intérieur du SVG : - Code:
-
<title>Aisne</title> <title>http://www.kittypaws.fr/eleveurs/aisne.php</title>
On 2 fois l'attribut title (à la fin). Je ne sais pas trop à quoi c'est du. Essaye éventuellement comme ça : - Code:
-
fr.departement02.attr({title: 'Aisne'}).attr({href:"http://www.kittypaws.fr/eleveurs/aisne.php"}); J'ai vu ça dans le code de quelqu'un dans les commentaires. | | |
|
| |
Akya
{ Membre }
Messages : 207
| Waouh. Comment tu fais pour voir cette partie, déjà ?
En tout cas, ça ne change rien, malheureusement. :/ | | |
|
| |
Nihil
{ Modérateur }
Messages : 1216
| Pour voir cette partie j'utilise l'inspecteur d'élément (sur Firefox : clic droit > examiner l'élément, sur Chrome clic droit > Inspecter l'élément). Sur Firefox j'ai installé Firebug avec lequel je suis plus à l'aise d'ailleurs. Autre tentative, dans ton fichier raphael-min.js (http://www.kittypaws.fr/eleveurs/js/raphael-min.js) par celui ci : http://www.7h47.com/files/js/raphael-min.js Tu avais la version 2.1.2 et sur le lien que je t'ai donné c'est la version 2.1.0... Chez moi mettre cette version là règle le problème Dis moi si cela t'aide (: | | |
|
| |
Akya
{ Membre }
Messages : 207
| Ah d'accord !
Alors en effet, ça fonctionne désormais. C'est tout de même bizarre qu'une version plus ancienne fonctionne mieux qu'une version plus récente. Bon en tout cas, ça a l'air de fonctionner à merveille. Donc encore mille mercis pour ce coup de main, tu finis toujours par trouver une solution, c'est juste extra. J'aurais même pas penser à changer le fichier pour une version moins récente, donc merci !
Je te souhaite une bonne continuation, et peut être à bientôt, qui sait. ;P | | |
|
| |
Nihil
{ Modérateur }
Messages : 1216
| En fait, pour m'en apercevoir j'ai trouvé un site sur lequel les liens cliquable marchait. J'ai copié leur code Javascript, mais même comme cela ça ne marchait pas... Le seul élément qui différait était donc la version de Raphael.js. En plus, le tuto est daté de 2011 . Ca peut arriver que certaines fonctionnalités évolues et ne s'écrivent plus de la même manière, c'est pourquoi quand on prend un vieux tuto, parfois le problème vient simplement du fait que la librairie ai évoluée Bon courage pour ton site ! | | |
|
| |
Akya
{ Membre }
Messages : 207
| Bonsoir ! Oui, d'accord, je comprends mieux. Quoiqu'il en soit, me revoici plus vite que prévu ! J'ai voulu faire le nécessaire pour que tout les liens soient reliés à leurs départements respectifs et... Ma carte a disparu. J'ai bien fais attention à ce que les numéros des départements concordent bien avec leurs coordonnées de SVG et... plus rien. Ça me désespère. xD Si j'avais pu savoir que c'était si compliqué à mettre en place ! | | |
|
| |
Nihil
{ Modérateur }
Messages : 1216
| Vers le début de ton code tu as ceci : - Code:
-
fr.departement2A.attr({title: 'Corse-du-Sud'}).attr({href:"http://www.kittypaws.fr/eleveurs/corse-du-sud.php"}); Le problème se règle-t-il si tu mets "fr.departement2A" avec un a minuscule ? ("fr.departement2a") | | |
|
| |
Akya
{ Membre }
Messages : 207
| Non ça ne change rien. :/ J'ai même changer 2B et ça n'est pas ça. | | |
|
| |
Nihil
{ Modérateur }
Messages : 1216
| En changeant 2a et 2b en même temps pour que cela soit en minuscule cela règle-t-il le problème ? (chez moi c'est bon après ça). Si cela ne règle pas le problème, peux tu laisser en ligne une version avec 2a et 2b en minuscule s'il te plait, pour que je comprenne mieux d'où vient le problème ? | | |
|
| |
Akya
{ Membre }
Messages : 207
| Autant pour moi, mon FTP avait mal fait le transfert. Ça fonctionne ! Merci encore une fois ! :3 Bonne continuation. | | |
|
| |
Contenu sponsorisé
| |
| |
| Problème lien sur carte réactive en SVG et JS/HTML [RESOLU] | |
|