Précédent   Forum des professionnels en informatique > Webmasters - Développement Web > JavaScript
JavaScript Forum programmation JavaScript. Lire : Cours JavaScript, FAQ JavaScript, Toutes les FAQ JavaScript et Sources JavaScript
Partagez cette discussion sur d'autres réseaux sociaux : Viadeo Twitter Google Facebook Digg Delicious MySpace Yahoo
Réponse Proposer ce sujet en actualité
 
Outils de la discussion
Publicité
'
Vieux 05/06/2011, 23h46   #1
Candidat au titre de Membre du Club
 
Inscription : novembre 2003
Messages : 60
Détails du profil
Informations forums :
Inscription : novembre 2003
Messages : 60
Points : 12
Points : 12
Par défaut Ouverture popup en arrière plan avec sélecteur d'images

Bonjour,
J'ai construit un sélecteur de sites internet (listes d'icones avec jquery) placé dans une info bulle-GoogleMap (qui s'affiche lorsque l'on clique sur le marqueur).
J'ai un problème car, à part sous Firefox, avec tous les autres navigateurs les sites s'affichent en arrière-plan (sauf le "bon coin", mais cela doit être du à une particularité du site) .
Je ne pense pas que le problème soit à rechercher dans GM ou Jquery, mais plutôt dans les fonctions que j'ai construites (dans les retours peut-être!).
Quelqu'un peut-il m'aider?

Merci d'avance
Trachy

Voici le site :
http://www.paysagesdefrance.com/index1.htm

Voici le code :
Code :
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>
philou8 est déconnecté   Envoyer un message privé Réponse avec citation 00
Réponse Proposer ce sujet en actualité
Outils de la discussion



Fuseau horaire GMT +2. Il est actuellement 18h51.


 
 
 
 
Partenaires

Hébergement Web