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
36
37
38
39
40
41
42
43
44
45
46
47
48
49
50
51
52
53
54
55
56
|
<!doctype html>
<html lang="en">
<head>
<meta charset="utf-8">
<meta name="viewport" content="width=device-width, initial-scale=1">
<title>jQuery UI Tabs - Default functionality</title>
<link rel="stylesheet" href="https://code.jquery.com/ui/1.12.1/themes/base/jquery-ui.css">
<link rel="stylesheet" href="/resources/demos/style.css">
<link rel="stylesheet" href="cartecss.css">
<script src="https://code.jquery.com/jquery-1.12.4.js"></script>
<script src="https://code.jquery.com/ui/1.12.1/jquery-ui.js"></script>
<script>
$( function() {
$( "#tabs" ).tabs();
$('.mapter_tlse_environ area').mouseover(function(){
var index=$(this).index();
alert(index);
});
} );
</script>
</head>
<body>
<div id="tabs">
<ul>
<li><a href="#tabs-1">Région Midi-Pyrénées secteur Toulouse et environ</a></li>
<li><a href="#tabs-2">Région Midi-Pyrénées secteur Nord-Est</a></li>
</ul>
<div id="tabs-1">
<div class="mapter_tlse_environ">
<img src="ToulouseIntra.jpg" id="map-image1" alt="" style="vertical-align: middle; text-align: center;" alt="" usemap="#map"/>
<map name="map">
<area shape="poly" coords="370, 867, 382, 865, 384, 874, 370, 878" />
<area shape="poly" coords="230, 787, 245, 795, 240, 803, 223, 794" />
<area shape="poly" coords="348, 697, 362, 695, 363, 707, 349, 708" />
<area shape="poly" coords="359, 598, 375, 610, 368, 618, 352, 606" />
<area shape="poly" coords="86, 359, 96, 362, 91, 373, 81, 368" />
<area shape="poly" coords="140, 389, 147, 391, 142, 399, 135, 394" />
<area shape="poly" coords="183, 409, 180, 416, 173, 413, 177, 405" />
<area shape="poly" coords="207, 418, 214, 421, 208, 432, 199, 425" />
<area shape="poly" coords="238, 438, 234, 445, 229, 441, 233, 435" />
</map>
</div>
</div>
<div id="tabs-2">
<div class="mapter_midipy">
<img src="MidiPy.jpg" id="map-image2" style="width: 2352px; max-width: 100%; height: auto;" alt="" usemap="#map" />
<map name="map">
<area shape="poly" coords="45, 24, 282, 23, 280, 264, 43, 261" />
</map>
</div>
</div>
</div>
</body>
</html> |
