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
| <!DOCTYPE html>
<html lang="fr">
<head>
<title>DjazAnnonces</title>
<meta charset=UTF-8">
<link rel="stylesheet" type="text/css" href="css/style.css" />
<script type="text/javascript" src="//ajax.googleapis.com/ajax/libs/jquery/1.10.2/jquery.min.js"></script>
<script type="text/javascript">
jQuery(function(§){
§('.djazmap').append('<div class="overlay>');
§('.djazmap area').mouseover(function(){
var index = §(this).index();
var left= -index * 485 - 485;
§('.djazmap .overlay').css({
backgroundPosition: left+"px 0px"
});
});
§('djazmap').mouseout(function(){
§('djazmap .overlay').css({
backgroundPosition : "173px 0px"
});
});
});
</script>
</head>
<body>
<!--CARTE INTERRACTIVE DES REGIONS-->
<div class="djazmap">
<img src="img/void.png" width=485 height= 465 usemap="#djazmap">
<map name="djazmap">
<area shape="poly" coords="105,310,108,315,108,318,109,319,112,319,116,316,128,329,138,342,149,342,151,344,151,346,158,352,177,369,181,369,183,368,186,368,189,376,210
////ETC pour les coordonnées
</map>
</div>
</body>
</html> |
Partager