Discussion :

[asurion]

Bonjour,
J'ai une carte de l’Europe avec plusieurs polygones :

Code html :

Sélectionner tout - Visualiser dans une fenêtre à part

1
2
3
4
5
6
7
8
9
10
11
12
13
14
15
16
17
18
19
20
21
22
23
24
25
26
27
28
29
30
31
32
33
34
35
<img src="blank_europe_map.jpg" alt="" id="img_ID" usemap="#Map"/>
<map name="Map" id="Map_ID">
    <area alt="" title="" href="#" shape="poly" coords="240,586,213,573,181,579,184,599,219,625,220,644,231,660,235,677,206,751,212,765,244,781,256,777,269,785,283,784,285,796,306,797,308,775,329,765,352,772,372,782,384,771,393,775,415,763,397,750,404,690,399,683,381,684,391,668,419,642,435,599,409,589,407,581,382,576,334,525,308,551,283,573,259,569,244,550" />
    <!-- France -->                
    <area alt="" title="" href="#" shape="poly" coords="62,707,54,754,99,782,49,905,69,922,70,944,84,952,117,936,175,950,180,935,195,933,198,923,223,906,217,883,249,841,303,818,305,800,288,801,269,794,264,786,254,782,240,783,208,767,201,753" />
    <area alt="" title="" href="#" shape="poly" coords="434,809,436,838,446,843,456,799" />
    <!-- Espagne -->                
    <area alt="" title="" href="#" shape="poly" coords="269,788,270,795,281,797,281,787" />
    <!-- Portugal -->                
    <area alt="" title="" href="#" shape="poly" coords="57,755,100,782,52,908,19,898,29,868,16,853,21,834,42,816" />
    <!-- Monaco -->
    <area alt="" title="" href="#" shape="poly" coords="376,783,381,771,395,777" />
    <!-- Ecosse -->
    <area alt="" title="" href="#" shape="poly" coords="279,367,271,362,308,326,276,317,295,298,269,289,245,316,238,309,232,323,241,329,225,345,242,340,228,369,240,356,245,365,231,389,229,395,254,395" />
    <!-- Irelande -->
    <area alt="" title="" href="#" shape="poly" coords="121,463,143,442,136,439,148,424,138,412,149,406,151,389,176,392,187,374,223,377,217,395,225,400,207,411,189,465,176,460,139,471,122,468" />
    <!-- Wales -->
    <area alt="" title="" href="#" shape="poly" coords="250,441,233,497,197,479,219,468,227,456,224,452,229,438" />
    <!-- Angleterre -->
    <area alt="" title="" href="#" shape="poly" coords="257,394,291,379,306,458,331,474,308,507,314,514,284,526,239,522,214,531,203,525,186,530,180,527,209,505,234,499,220,493,197,487,201,475,229,454,221,452,227,432,245,437,255,419,250,409" />
    <!-- Belgique -->
    <area alt="" title="" href="#" shape="poly" coords="337,525,336,535,348,533,346,542,356,544,354,552,363,550,362,560,372,555,378,570,384,574,390,574,396,560,403,553,402,542,396,529,381,518,367,521,354,518" />
    <!-- Luxembourg -->
    <area alt="" title="" href="#" shape="poly" coords="400,560,406,570,402,582,392,578,393,569" />
    <!-- Pays-Bas -->
    <area alt="" title="" href="#" shape="poly" coords="357,519,352,511,362,506,370,507,368,497,389,463,406,454,431,460,422,486,429,489,420,506,409,507,402,538,396,537,397,523,380,515,363,521" />
    <!-- Allemagne -->
    <area alt="" title="" href="#" shape="poly" coords="404,538,411,507,421,509,433,490,427,485,436,453,446,450,454,460,460,447,477,453,467,439,465,419,481,419,492,429,506,428,505,441,510,447,515,440,521,439,544,429,566,449,563,476,571,490,570,496,581,534,524,561,531,583,556,610,536,629,545,647,538,648,534,644,486,649,476,650,448,641,443,635,438,641,422,641,437,597,414,589,404,580,406,572,400,562" />
    <!-- Suisse -->
    <area alt="" title="" href="#" shape="poly" coords="409,648,386,685,399,676,405,694,418,697,435,681,449,692,460,678,469,683,486,669,465,660,466,645,446,638" />
    <!-- Italie -->
    <area alt="" title="" href="#" shape="poly" coords="401,701,409,718,396,727,404,736,401,748,418,755,416,761,438,752,460,754,474,768,481,789,536,851,557,854,569,866,587,873,587,884,598,889,604,889,614,916,612,931,607,946,590,949,568,955,536,952,523,958,540,972,560,985,568,985,584,997,596,984,594,969,596,953,614,948,632,928,643,919,636,907,626,897,635,873,670,890,674,878,607,839,604,834,561,804,554,774,524,755,523,742,527,728,522,719,550,704,555,689,546,690,555,681,526,670,524,660,483,668,483,676,465,687,462,678,451,691,435,678,425,693" />
    <!-- Danemark -->
    <area alt="" title="" href="#" shape="poly" coords="465,355,457,391,462,414,480,415,503,377,499,366,506,336" />
</map>

Le problème est que si je redimensionne la fenetre du navigateur, les points sont décalés.
J'ai essayé ce plugin, mais il ne fonctionne pas avec JQuery 2 et j'ai besoin de JQuery 2 pour d'autres choses sur mon site.

Merci pour votre aide

[Watilin]

Tu peux utiliser jQuery.noConflict(true) pour jongler entre les versions de jQuery. http://blog.nemikor.com/2009/10/03/u...ons-of-jquery/

Edit: je viens de tester avec jQuery 2.2 et ça marche très bien. Tu es sûr que tu fais les choses correctement ?