En una web que estoy desarrollando, he puesto un mapa para indicar la posición de distintos lugares con iconos de forma que, cuando hagas click en uno de ellos aparezca un popup que amplíe algo la información.
Para mostrar el mapa, que es Open Street Map, he utilizado OpenLayers. El problema es que no consigo modificar el estilo del popup, que es muy básico y algo cutre.
Por CSS no se puede, ya que aplica los estilos inline en el propio div del popup, así que la hoja de estilos no surte efecto.
Para mostrar los popups, utilizo la clase OpenLayers.Layer.Text.
La verdad es que apenas encuentro información, y la documentación "oficial" de OpenLayers es, cuanto menos, muy pobre.
Dejo el código de cómo cargo el mapa y los popups:
Código Javascript:
Ver original
map = new OpenLayers.Map("mapdiv"); map.addLayer(new OpenLayers.Layer.OSM()); var pois = new OpenLayers.Layer.Text( "My-Points", { location:"/wp-includes/osm/textfile.php", projection: map.displayProjection, }); map.addLayer(pois); //Set start centrepoint and zoom var lonLat = new OpenLayers.LonLat( -2.5, 40.26 ) .transform( new OpenLayers.Projection("EPSG:4326"), // transform from WGS 1984 map.getProjectionObject() // to Spherical Mercator Projection ); var zoom=6; map.setCenter (lonLat, zoom);
Gracias de antemano