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
57
58
59
60
61
62
63
64
65
66
67
68
69
70
71
72
73
74
75
76
77
78
79
80
81
82
83
84
85
86
87
88
89
90
91
92
93
94
95
96
97
98
99
100
101
102
103
104
105
106
107
108
109
110
111
112
113
114
115
116
117
118
119
120
121
122
123
124
125
126
127
128
129
130
131
132
133
134
135
136
137
138
139
140
141
142
143
144
145
146
147
148
149
150
| <!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Strict//EN"
"http://www.w3.org/TR/xhtml1/DTD/xhtml1-strict.dtd">
<html xmlns="http://www.w3.org/1999/xhtml">
<head>
<meta name="viewport" content="initial-scale=1.0, user-scalable=no"/>
<meta http-equiv="Content-Type" content="text/html; charset=iso-8859-1">
<title>Tourisme : Paysages de France, Golfe du Morbihan, location, Villes du Golfe du Morbihan, hébergements, vacances</title>
<!-- script jQuery liste déroulante icones -->
<script type="text/javascript" src="libraryjQuery/customdropdown/js/jquery.js" ></script>
<script type="text/javascript" src="libraryjQuery/customdropdown/js/jquery-dropdown.js" ></script>
<!-- script Google Maps -->
<script type="text/javascript" src="http://maps.google.com/maps/api/js?sensor=false"></script>
<script language="JavaScript" src="libraryV3/markermanager_packed.js" type="text/JavaScript"></script>
<script src="libraryjQuery/gmap3/gmap3.min.js" type="text/javascript"></script>
<!-- Feuilles de style jQuery liste déroulante icones-->
<link rel="stylesheet" type="text/css" href="libraryjQuery/customdropdown/customdropdown.css" />
<!-- Feuilles de style -->
<link rel="stylesheet" type="text/css" href="style/emplacement.css" media="all">
<link rel="stylesheet" type="text/css" href="style/police.css" media="all">
<link rel="stylesheet" type="text/css" href="style/format.css" media="all">
<style type="text/css">
html{
height:100%;
}
body{
height:100%;
margin:0px;
padding:0px;
}
#infoWindow{
margin:0;
padding:0;
width: 370px;
}
#infoWindow h1{
font:20px italic "Times New Roman", Times, serif;
color:#267AA8;
text-align:center;
}
#infoWindow h2{
font:17px "Times New Roman", Times, serif;
margin:.5em 0;
padding:0;
text-align:center;
color:orange;
}
#texteinfoWindow{
margin:0;
padding:0;
font:11px "Trebuchet MS",sans-serif;
}
#texteinfowindow p{
margin:.5em 0;
padding:0;
text-indent:2em;
text-align:left;
}
#select_icones{
float: right;
margin: 0 .5em .5em 0;
width: 220px;
height: 163px;
}
#map{
height:100%;
}
</style>
<script language="javascript">
var other_web_sites =[];
other_web_sites[0]="http://www.vacances.com/location-vacances.php?id_zone=23549";
other_web_sites[1]="http://www.papvacances.fr/annonces/location-vacances-morbihan-56-g420";
other_web_sites[2]="http://www.leboncoin.fr/locations_de_vacances/offres/bretagne/morbihan/?f=a&th=1";
other_web_sites[3]="http://www.armor-vacances.com/locations-56-morbihan/golfe-du-morbihan.html";
other_web_sites[4]="http://www.7enlocation.com/d56-t0-p0/location-vacances-morbihan";
other_web_sites[5]="http://www.a-gites.com/bretagne/location-vacances-morbihan.html";
function analyse(url){
window.open(url,'paysagesdefrance','toolbar=yes,menubar=yes,location=yes,scrollbars=yes,resizable=yes,width=1170,height=600,screenx=0,screenY=0,left=0,top=0');
return;
}
function f(content)
{
var debut = content.html().indexOf("http");
var fin = content.html().indexOf(" ",debut);
var web_site = content.html().substring(debut,fin);
// selon navigateur le nom est terminé par une apostrophe ou un guillemet
if((web_site.charAt(web_site.length - 1)=='"')||(web_site.charAt(web_site.length - 1)=="'")){web_site=web_site.substring(0,web_site.length-1)};
analyse(web_site);
return;
}
function selecteur_icones(){
$(function(){
document.getElementById('select_icones').innerHTML ="<ul><li value='1'><img src='images/infobulle/icone_vacances.jpg' alt='"+other_web_sites[0]+"' title='www.vacances.com'/></li><li value='2'><img src='images/infobulle/icone_pap.jpg' alt='"+other_web_sites[1]+"' title='www.pap.fr'/></li><li value='3'><img src='images/infobulle/icone_leboncoin.jpg' alt='"+other_web_sites[2]+"' title='www.leboncoin.fr' /></li><li value='4'><img src='images/infobulle/icone_armorvac.jpg' alt='"+other_web_sites[3]+"' title='www.armorvac.com' /></li><li value='5'><img src='images/infobulle/icone_7en.jpg' alt='"+other_web_sites[4]+"' title='www.7enlocation.com' /></li><li value='6'><img src='images/infobulle/icone_amivac.jpg' alt='"+other_web_sites[5]+"' title='www.amivac.com' /></li></ul>";
$("#select_icones ul:eq(0)").imgDropDown({title:"<img id='image_selected' src='images/infobulle/icone_points.jpg' alt='autres sites' title='autres sites'/>", callback:f});});
}
function load(){
//carte
var centreCarte = new google.maps.LatLng(47.58879945676841,-2.8348159790039062);
var optionsCarte = {
zoom: 11,
center: centreCarte,
mapTypeId: google.maps.MapTypeId.ROADMAP
}
var mymap = new google.maps.Map(document.getElementById("map"), optionsCarte);
// infoWindow
var html = '<div id="infoWindow">' +
'<h1>Golfe du Morbihan</h1>' +
'<h2>Sites Web</h2>' +
'<div id="texteinfoWindow">' +
'<div id="select_icones"><a href="#" onmouseover="javascript:selecteur_icones()"><img src="images/infobulle/icone_points.jpg" alt="sites web" title="sites web"/></a></div>' +
'</div>' +
'</div>';
var infobulle = new google.maps.InfoWindow({
content: html
})
//marqueur
var optionsMarqueur = {
position: centreCarte,
map: mymap,
title: "infos site_web"
}
var marqueur = new google.maps.Marker(optionsMarqueur);
google.maps.event.addListener(marqueur, 'click', function() {
infobulle.open(mymap, marqueur);
});
}
</script>
</head>
<body OnLoad="load()">
<div id="map"></div>
</body>
</html> |
Ouverture popup en arrière plan avec sélecteur d'images
Répondre avec citation
Partager