✔ css div ausrichtung

Status
Nicht offen für weitere Antworten.
G

GuenniFD

Mitglied
Hallo zusammen!
Ich habe ein Java Script, dass eine Art mouseover-pulldown-menü sein soll. Die Darstellung erfolgt per div´s (Bsp: <div id="m2" style="position:absolute; left:321px; top:114px; width:100; height:100; z-index:5; visibility: hidden">), aber da tritt ein kleines Problem auf.
Und zwar richtet sich das ja jedes mal vom linken abstand und vom oberen aus und meine tabelle mit den inhalten wird zentriert ausgerichtet, deswegen klappt das nicht ganz, da die div´s bei unterschiedlichen fenstergrößen immer woanders stehen!
kann ich das irgendwie so anpassen, dass sie sich an der tabelle ausrichten?
Achso ich hab auch noch gehört, dass es zu Problemen mit dem IE kommen kann, stimmt das?
Ich hab ewig nach so einem Java Script gesucht und hab bisher noch keine Alternative gefunden, deswegen hoffe ich das es geht.
Schonma vielen Dank im Vorraus.
Ich hoffe mir kann jemand behilflich sein....
MFG
Günni
 
Na ja, da Du im style ein top und ein left definiert hast, ist es ja auch normal, dass sich das Div an der dort definierten position anordnet!
MIt align="center" würde das Div mittig angeordnet werden.
Aber um Dir genauere Hilfe geben zu können, wäre ein wenig Quelltext schon ganz hilfreich.

redlama
 
erstma danke für die Antworten!
Weiß denn jemand wie das mit den div's und dem IE ist, weil das müsste ja schon ein wenig kompatibel sein.
Ich bräuchte praktisch einen Rahmen, wo ich sagen kann, dass sich die divs dann an diesem Rahmen (in meinem Fall die Tabelle) ausrichten, damit es nicht bei unterschiedlichen Größen des Fensters, etwas anderes anzeigt...
Wenn ich daheim bin kann ich ja nomma das java script posten...
(bin normal auch ein java script gegner, weil die seite ja kompatibel sein soll, aber es wurde so gewünscht)
 
Deine Tabelle hat doch sicher eine feste Breite, oder?
Dann könntest Du doch dem Div dieselbe Breite geben und ebenfalls mittig ausrichten.
Dann wäre dein Div immer direkt unter der Tabelle!
Mit JaaScript würde ich bei sowas überhaupt nicht arbeiten!

redlama
 
jo die tabelle hat eine feste breite steht aber zentriert, deswegen kommt es ja zu den verschiebungen...
naja ich will eigentlich nur ein mouseover-pulldown-menü machen, die gibt es ja sehr oft aber ich hab noch keine schöne lösung gefunden, wie würdest du es denn machen und vorallem so, dass es kompatibel ist?
soll ich den code noch posten?
 
Ja, poste mal den Code, dann schaue ich morgen mal drauf.
Und vielleicht hat dann ja noch jemand anderes eine Idee!

redlama
 
ja du hast doch was von einem anderen prinzip gesagt, was meinst du damit? nur css oder was anderes?

das javascript:
<script language="JavaScript">

function clean ()
{
if ((navigator.appName=='Netscape') && (navigator.appVersion.charAt (0)<'5'))
{
window.document.b.visibility="hide";
window.document.m1.visibility="hide";
window.document.m2.visibility="hide";
window.document.m3.visibility="hide";
return;
}
if (navigator.appVersion.charAt (0)<'5')
{
var layers=document.all.tags ("div");
}
else {
var layers=document.getElementsByTagName("div");
}
layers[0].style.visibility='hidden';
layers[2].style.visibility='hidden';
layers[4].style.visibility='hidden';
layers[6].style.visibility='hidden';
return;
}

function menu (i)
{

switch(i)
{
case 1:
{
if ((navigator.appName=='Netscape') && (navigator.appVersion.charAt(0)<'5'))
{
window.document.b.visibility="show";
window.document.m1.visibility="show";
window.document.m2.visibility="hide";
window.document.m3.visibility="hide";
return;
}
if (navigator.appVersion.charAt (0)<'5')
{
var layers=document.all.tags ("div");
}
else {
var layers=document.getElementsByTagName("div");
}
layers[0].style.visibility='visible';
layers[2].style.visibility='visible';
layers[4].style.visibility='hidden';
layers[6].style.visibility='hidden';
return;
}
case 2:
{
if ((navigator.appName=='Netscape') && (navigator.appVersion.charAt(0)<'5'))
{
window.document.b.visibility="show";
window.document.m1.visibility="hide";
window.document.m2.visibility="show";
window.document.m3.visibility="hide";
return;
}
if (navigator.appVersion.charAt (0)<'5')
{
var layers=document.all.tags ("div");
}
else {
var layers=document.getElementsByTagName("div");
}
layers[0].style.visibility='visible';
layers[2].style.visibility='hidden';
layers[4].style.visibility='visible';
layers[6].style.visibility='hidden';
return;
}
case 3:
{
if ((navigator.appName=='Netscape') && (navigator.appVersion.charAt(0)<'5'))
{
window.document.b.visibility="show";
window.document.m1.visibility="hide";
window.document.m2.visibility="hide";
window.document.m3.visibility="show";
return;
}
if (navigator.appVersion.charAt (0)<'5')
{
var layers=document.all.tags ("div");
}
else {
var layers=document.getElementsByTagName("div");
}
layers[0].style.visibility='visible';
layers[2].style.visibility='hidden';
layers[4].style.visibility='hidden';
layers[6].style.visibility='visible';
return;
}
}

}
</script>

der aufruf über die divs:
<div id="h1" style="position:absolute; left:222px; top:86px; width:100; height:25;z-index:2; visibility: visible">
<a href="#" onmouseover="menu(1)">Menu 1</a>
</div>

<div id="m1" style="position:absolute; left:225px; top:112px; width:85px; height:103px; z-index:3; visibility: hidden" >
<a href="#">Punkt 1</a><br>
<a href="#">Punkt 2</a><br>
<a href="#">Punkt 3</a><br>
<a href="#">Punkt 4</a></div>

<div id="h2" style="position:absolute; left:322px; top:87px; width:100; height:25; z-index:4; visibility: visible">
<a href="#" onmouseover="menu(2)">Menu 2</a></div>

<div id="m2" style="position:absolute; left:321px; top:114px; width:100; height:100; z-index:5; visibility: hidden">
<a href="#">Punkt 1</a><br>
<a href="#">Punkt 2</a><br>
<a href="#">Punkt 3</a><br>
<a href="#">Punkt 4</a></div>
 
sind die denn kompatibel und welches genau meinst du?
ich bin halt jetzt schon am 4ten oder 5ten Teil, das ich ausprobiere und wenn ich immer wieder umherschwank, dann komm ich net so richtig weiter.
Aber wenn du meinst das geht damit schöner und es ist auch IE tauglich dann werd ich mir das ma anschauen.. (bin halt ein wenig frustriert, weil ich bestimmt schon so zusammengerechnet 10Std. am rumsuchen, rumprobieren und rumtüfteln bin)
 
Status
Nicht offen für weitere Antworten.

Neue Beiträge

Zurück