mit welchen CSS Befehl verschiebt man eigentlich das Zoompanel und die Navigationsbuttons? Ich möchte alles ein bisschen tiefer auf der Karte haben.
Wyo
Versuchs mal bei
.olControlPanPanel
.olControlZoomPanel
Wobei du vermutlich jedes Element einzel anordnen musst.
Gruß,
ajoessen
Habe ich => kein Effekt. Auch habe ich .olControlPanZoomBar probiert, auch kein Effekt. Was noch?
Wyo
#OpenLayers.Control.PanZoomBar_7
Nutzt aber wahrscheinlich leider auch nichts, da die CSS-Eigenschaften top und right (für position:absolute) direkt am Objekt drankleben. Nach der Gewichtung der CSS-Angaben [1] kann das, was im style=“…” am Element dran klebt, nicht durch eine Klasse o.ä. überschrieben werden.
Da das Element aber auch zu Beginn noch nicht existiert, wirst du das über javascript lösen müssen. Einfach am Ende deiner init-Funktion für die Karte:
document.getElementById(‘OpenLayers.Control.PanZoomBar_7’).style.top=‘1234567890px’; (oder wie weit auch immer das von der Oberkante entfernt sein soll)
Ich hab’s jetzt nur in Firebug getestet, sollte aber auch direkt im Skript funktionieren.
Viel Erfolg,
Malte
[1] http://de.selfhtml.org/css/formate/kaskade.htm#spezifitaet
was hast du genau gemacht? und wo?
sind maximal 3 zeilen.
Ich gewichte das aber als ein Fehlverhalten, das korrigiert werden sollte. Sollte eigentlich keine Sache sein, ein entsprechendes “.olControlPanZoomBar” ins “style.css”, sowie die Eigenschaften weg vom Objekt. Wahrscheinlich braucht es noch etwas mehr, werde heute Abend es zu lösen versuchen.
Eigentlich nur ein paar Pixel, damit oberhalb noch Platz für die Zoomlevel-Anzeige ist 
Danke, erspart mir einige Zeit beim danach suchen.
Es funktioniert, musste allerdings bei mir “PanZoomBar_8” nehmen.
Ähm ich mach mal den alten Thread wieder auf.
Und zwar probiere ich fieberhaft einem Popup ein anderes Schließen Icon unterzuschieben, aber es klappt nicht 
Ich habe schon probiert einfach per
.olPopupCloseBox {
background:url("myclose.gif") no-repeat scroll 0 0 transparent; cursor:pointer;
}
auch per externer CSS.
Außerdem habe ich mit einer eigenen CSS Klasse und
popup.closeDiv='<div style="width: 17px; height: 17px; position: absolute; right: 5px; top: 5px;" class="myPopupCloseBox" <\/div>'
probiert das zu machen, da knackt es aber in der OpenLayers Lib 
Hat da jemand eine Idee? Ich bin leider nicht so der JS, CSS, HTML Experte 
@!i!: Was für eine Art PopUp meinst du? Die Darstellung eines JavaScript alert-PopUps ist beispielsweise abhängig von der Benutzeroberfläche, und nicht von CSS…
EDIT: Ah, du meinst die Leiste, die Aufklappt, zum Beispiel für den Layer-Switcher?
Am einfachsten ist es die komplette OL-Bibliothek zu laden, und das Bild auszutauschen.
Alternativ:
Das Bild sollte am besten in der selben Größe sein (18x18), ist aber eigentlich irrelevant.
Per CSS kannst du es nicht ändern, weil es kein Hintergrundbild ist, sondern ein normales Bild (per img-Tag).
#featurePopup_close.olPopupCloseBox {
background:url(“…/images/paint.png”) no-repeat scroll 0 0 transparent; cursor:pointer;
}
hi, so ginge das bei mir - wenn ich wollte
eventuell ist das nur ein “brutaler workaround” aber so geht es schon mal.
popups haben ein div-feld mit der id “featurePopup_close”. zumindest so findet er das dann.
gruss
walter
Hi Walter, ja das habe ich mir mit Firebug auch so rausgesucht.
Leider funktioniert das bei mir nicht, kann das sein dass AnchoredPopups das irgendwie anders machen?
Bei AnchoredPopups hatte ich mal mit “important” Erfolg:
<style>
.olPopupCloseBox {background-image: url("/pfad/zum/bild") ! important;}
</style>
Mein Web Developer-Plugin sagt nämlich, dass /OpenLayers/theme/default/style.css nach meinen css-Anweisungen in der html-Datei kommt und mir mein css überschreibt. Mit “! important” vermeidet man das.
Style-Anweisungen werden doch der Reihenfolge nach abgearbeitet, bei Gleichwertigkeit kommt die Letzte zu Zuge. Aber trotzdem Danke für den “! important” Tip.
Wyo
PS Welches Developer-Plugin?
Ein Firefox-Plugin, für Webseitenbastler, css-Eigenschaften von einzelnen Teilen der Seite ansehen, Formularfelder anschauen, Tabellen sichtbar umranden, Cache ausschalten… sowas halt. Finds ganz praktisch, hab aber keinen Vergleich mit anderen Tools.
da würde ich einfach die reihenfolge ändern:
erst openlayers, dann osm und zuletzt eigenes css.
damit überschreibt man kontrolliert css-werte durch eigene werte.
gruss
walter
firebug ist auch was feines. macht ähnliches kommt aber afaik direkt aus den mozilla-küche.
Klingt jetzt vielleicht blöd die Frage…: aber wie mache ich das?
Die Stelle, an der das OL-css-Zeug geladen wird, steckt im Javascript, an das ich von Aussen nicht rankomme. Mein Versuch mit diesem Schliessen-Icon sieht z.B. so aus:
<html>
<script src="OpenLayers.js"></script>
<style>.olPopupCloseBox {background-image: url("/images/smiley.png") ! important;}</style>
<script type="text/javascript">
function init(){map=.....}
</script>
<body>....</body></html>
Ich dachte, ich hätte damit schon die letzte Möglichkeit erwischt, was eigenes unterzubringen. An welcher stelle wäre mein eigener style besser aufgehoben?
Grüße, Max
Hmm also trotz “important” und auch umgestellter Reihenfolge überschreibt er aber trotzdem mein CSS
Vielleicht reden wir auch aneinander vorbei… Ich hab an sowas gedacht: Popups mit einem Smiley statt dem Kreuz und geht hier mit FF, Opera und einem uralten IE.
Danke dein Code geht, wieso aber geht meiner nicht?
<style>.olPopupCloseBox {background:url("close.gif") no-repeat scroll 0 0 transparent; cursor:pointer ! important;}</style>
Das ist doch quasi dasselbe?