Wednesday, 23. June 2010
Transparente Popups in Openlayers
Ich hab mal OpenLayers upgedatet. Inzwischen ist 2.9.1 draussen und ich lag immer noch über 2 Zehntel hinten. Ab und zu soll man ja auch probieren, liebgewonnene traditionelle Krücken über Bord zu werfen. Also schau ich mal, obs mit dem IE8 klappt und ob ich den IE7-Kompatibilitätsmodus endlich verlassen kann.
Es klappt, zumindest war ausser leichten Geschmacksabweichungen kein grober Fehler mehr zu finden, nur die Popups hatten eine merkwürdig durchsichtige Schrift, manche auch transparente Bilder:
Das sah zwar ganz nett aus mit der durchscheinenden Sahara hinter dem Text und dem blauen Mittelmeer unter dem [X], war aber bei manchen Hintergrundkarten nur schwer lesbar.
Dagegen hilft dieser Zauberspruch Fluch im CSS
.olPopup * {
-ms-filter: "progid:DXImageTransform.Microsoft.Alpha(Opacity=1.0)";
filter: alpha(opacity=100);
-khtml-opacity: 1.0;
-moz-opacity: 1.0;
opacity: 1.0;
}
der anscheinend allen Browsern beibringt, das Popup nicht transparent darzustellen (-ms-filter für IE8, filter für IE7, -khtml für ältere Safaris, -moz für alte Firefox 2 und das letzte für alle neueren Browser). An welcher Stelle in OpenLayers allerdings gefordert wird, dass das Popup durchsichtig sein soll, bleibt mir völlig unklar, andere Browser machens auch ohne diesen CSS-Eintrag korrekt. Die Reihenfolge ist angeblich wichtig, weil wenn "-ms-filter" nach "filter" erscheint, gehts sowohl mit IE7 als auch IE8, aber nicht mit einem IE8 im "IE7-Kompatibilitätsmodus"...
Nachtrag: "filter: alpha(opacity=100);" kommt wieder raus, weil das bringt den Internet Explorer 6 dazu, ganz durchsichtige Popups zu erzeugen.