nicht angemeldet
Problem mit position:absolute in Mozilla!?!
Moin zusammen!
Irgendwie bin ich mit Positionsangaben noch nie so richtig klar gekommen...
Also ich hab auf dieser Seite hier:
http://www.b-anhaenger.de/thirdgen/universal.php?w2=ueberuns&menue=false
unten eine kleine Tabelle, hinter der sich ein Bild verstecken soll. Wenn ich nun mit der Maus draufgehe fährt das Bild unter der Tabelle hervor.
Sowei so gut.
Aaaber: Mozilla (1.4) richtet den sich verschiebenden Bereich nicht wie geplant am umgebenden div aus (welches, so hab ichs verstanden eigentlich das parent-Element sein müsste), sondern am body.
Das ist etwas dumm. So kann die Seite natürlich nicht bleiben.
Opera machts wie Mozilla.
Firebird (0.6.1) und IE (6) machen es genau wie geplant.
Besonders der Unterschied zwischen Firebird und Mozilla wundert mich, ich dachte die zwei wären sich codebedingt einig, was die Darstellung angeht.
Wer sichs ohne Bilder schwer vorstellen kann: hier die "alte" Seite:
http://www.b-anhaenger.de/ueberuns.htm
Frage:
Mach ich im Code was falsch, oder ist Mozilla einfach zu blöd?
Der Bereich:
<div style="float:right; margin-left:0px; z-index:2; position:relative; top:0px; left:0px" onMouseover="show_hidden_pre()" onMouseout="hide_hidden_pre()">
...
<span id="hidden" style="position:absolute; z-index:1; top:0px; left:0px"><img src="ueberun3.gif" width="313" height="373"></span>
</div>
und das Script:
<script language="JavaScript" type="text/javascript">
<!--
function show_hidden_pre()
{
show_abbruch = false;
hide_abbruch = true;
show_hidden()
}
function show_hidden()
{
if(show_abbruch == false)
{
var px_index = document.getElementById("hidden").style.left.indexOf("p");
var px_wert = document.getElementById("hidden").style.left.slice(0,px_index);
if(px_wert >= -299)
{
var new_px_wert = px_wert - 10;
document.getElementById("hidden").style.left = new_px_wert + "px";
window.setTimeout("show_hidden()",100);
}
}
}
function hide_hidden_pre()
{
hide_abbruch = false;
show_abbruch = true;
hide_hidden()
}
function hide_hidden()
{
if(hide_abbruch == false)
{
var px_index = document.getElementById("hidden").style.left.indexOf("p");
var px_wert = document.getElementById("hidden").style.left.slice(0,px_index);
if(px_wert <= -4)
{
var new_px_wert = px_wert - (-10);
document.getElementById("hidden").style.left = new_px_wert + "px";
window.setTimeout("hide_hidden()",100);
}
}
}
//-->
</script>
Das Script wird natürlich noch mit ein paar abfragen garniert, erst mal soll aber die Anzeige stimmen. (ob getElementById vorhanden etc.)
Wer zum Script noch Verbesserungsvorschläge hat, da bin ich offen für allen, JavaScript ist leider nicht so mein Fall.
Der IE zeigt übrigenz das gleiche Verhalten, wenn ich im äußeren div die positionsangabe rausnehme.
Ich kann natürlich einfach wie bisher einfach ein paar Browser aussortieren, aber irgendwie befriedigt mich das nicht.
Bitte zeigt mir meinen Fehler, oder zumindst einen Tipp ;)
-
Hallo,
Aaaber: Mozilla (1.4) richtet den sich verschiebenden Bereich nicht wie geplant am umgebenden div aus (welches, so hab ichs verstanden eigentlich das parent-Element sein müsste), sondern am body.
Ich hab gerade keine Zeit deinen Code anzuschauen. Aber ich denke, dir könnte ein Fehler unterlaufen sein, der mir auch schon passiert ist.
Das parent-Element welches du meinst ist bei einer positionierten Box nicht unbedingt die Box des umschließenden HTML Tags. Es wäre in diesem Fall die Box des ersten umschließenden und positionierten Tags. Also verpasse deinem umgebenden div doch einfach mal ein position: absolute/relative ohne top, bottom, left oder right Angabe und schau nach, was passiert.Viele Grüße,
Stefan
-
Hallo,
betätige mich mal als klugscheißender Trittbretfahrer:
Ich hab gerade keine Zeit deinen Code anzuschauen. Aber ich denke, dir könnte ein Fehler unterlaufen sein, der mir auch schon passiert ist.
Das parent-Element welches du meinst ist bei einer positionierten Box nicht unbedingt die Box des umschließenden HTML Tags. Es wäre in diesem Fall die Box des ersten umschließenden und positionierten Tags. Also verpasse deinem umgebenden div doch einfach mal ein position: absolute/relative ohne top, bottom, left oder right Angabe und schau nach, was passiert.Das geschilderte Problem hatte ich auch mal, Du mußt dem umschließenden DIV vermutlich ein position:absolute verpassen. (Bislang ist es ja nur relativ positioniert.)
Tschau,
apstrakt--
http://www.cafe-abstrakt.de-
Das geschilderte Problem hatte ich auch mal, Du mußt dem umschließenden DIV vermutlich ein position:absolute verpassen. (Bislang ist es ja nur relativ positioniert.)
Tschau,
apstraktGut, dann bin ich einen Schritt weiter:
Wenn ich den äußeren div mit position:absolute versehe, verhält sich das innere Element so wie es soll.Allerdings, deswegen hatte ich relative gewählt, ist das äußere div jetzt nicht mehr an seinem Platz, sondern klebt seinerseits am linken Rand...
Jetzt hab ich anstatt eines falsch positionierten Teils in Mozilla und Opera, zwei falsch positionierte in allen Browsern. Noch nicht wirklich was ich brauche.
Wie bringe ich ein absolute-positioniertes div dazu dort zu bleiben wo es gerade ist UND Platz zu verbrauchen?
Leider soll es nämlich irgendwo im Fliestext hocken, Position fest einstellen ist da nicht.-
hi,
Wie bringe ich ein absolute-positioniertes div dazu dort zu bleiben wo es gerade ist UND Platz zu verbrauchen?
gar nicht.
Leider soll es nämlich irgendwo im Fliestext hocken, Position fest einstellen ist da nicht.
sieh dir mal die css-eigenschaft float genauer an.
gruss,
wahsaga-
Wie bringe ich ein absolute-positioniertes div dazu dort zu bleiben wo es gerade ist UND Platz zu verbrauchen?
gar nicht.Dann ist absolute für diesen Zweck nicht zu gebrauchen.
Leider soll es nämlich irgendwo im Fliestext hocken, Position fest einstellen ist da nicht.
sieh dir mal die css-eigenschaft float genauer an.Ja, gemacht... und nun??
Sorry, ich komm nicht drauf was du mir damit sagen willst :(Ich werd also das Script wieder mal auf den IE beschränken, und hoffen, dass die anderen mit der Interpretation bald nachziehen...
-
Hallo,
"position:relative; top:0px; left:0px;" kann man übrigens weg lassen, ist default.
Ich werd also das Script wieder mal auf den IE beschränken, und hoffen, dass die anderen mit der Interpretation bald nachziehen...
Nee, das ist die falsche Herangehensweise. Es ist nämlich gar nicht klar, welcher Browser hier "falsch" interpretiert. Ich selbst weiß zwar auch nicht, was in der Spezifikation des W3C steht, aber in der Regel sind Netscape und Opera näher dran als der IE, so daß der Schuß nach hinten losgehen könnte und das ganze womöglich am Ende im IE 7 nicht mehr läuft. Du solltest Dir schon die Mühe machen, zumindest ein Workaround für die anderen Browser zu schreiben. Wer mit Javascript arbeitet, kommt darum nicht herum. Das mindeste ist, den SpecialEffect für die anderen Browser auszuschalten, so daß man trotzdem was Vernünftiges angezeigt bekommt.
Allerdings kann ich mir nicht vorstellen, daß es keien "gute" Lösung gibt. Mir fällt jetzt ad hoc nur keine ein.
Tschau,
apstrakt--
http://www.cafe-abstrakt.de-
"position:relative; top:0px; left:0px;" kann man übrigens weg lassen, ist default.
Wenn ich es weglasse, verhält sich der IE wie Mozilla. Mit dieser ziemlich sinnfreien Angabe (das ist mir schon klar) bringe ich aber zumindest den IE dazu das zu tun was ich will.
Nee, das ist die falsche Herangehensweise. Es ist nämlich gar nicht klar, welcher Browser hier "falsch" interpretiert. Ich selbst weiß zwar auch nicht, was in der Spezifikation des W3C steht, aber in der Regel sind Netscape und Opera näher dran als der IE, so daß der Schuß nach hinten losgehen könnte und das ganze womöglich am Ende im IE 7 nicht mehr läuft.
Hab grade die neueste Mozilla Beta (1.5) getestet:
Die zeigt mir an wie ich es will. Die Richtung von IE scheint hier also ausnahmsweise mal richtig(er) zu sein. Ob Opera auch nachziehen wird halte ich in näherer Zukunft allerdings für eher unwahrscheinlich. Das ist besonders dumm, weil er sich ja nicht als Opera identifiziert, aussortieren ist hier nicht...Das mindeste ist, den SpecialEffect für die anderen Browser auszuschalten, so daß man trotzdem was Vernünftiges angezeigt bekommt.
Das werd ich vorerst machen.
Danke an alle für eure Hilfe,
dbenzhuser-
Hallo,
ist schon ne ärgerliche Sache und war auch mir unverständlich, daß man nicht innerhalb eines "fließend" gesetzten elements ein anderes absolut positionieren kann. javascript-programmierung ist absolut nervig. muß ich gleich auch wieder machen...
zu OPERA: doch, man kann opera an der existenz des objekts window.opera erkennen und so aussortieren:
if (window.opera) alert("Ich bin ein Opera.");
gruß,
axel-
zu OPERA: doch, man kann opera an der existenz des objekts window.opera erkennen und so aussortieren:
if (window.opera) alert("Ich bin ein Opera.");
Cool, danke!
-
-
-
Moin,
"position:relative; top:0px; left:0px;" kann man übrigens weg lassen, ist default.
Das stimmt nicht ganz, top und left kann man weglassen, position:relative jedoch nicht.
Tschau
Martin
-
-
-
-
-
-