Dynamische Navigation

[Sebastian Schuppel]

Hallo,

ich habe auf meiner homepage (http://slp.kilu3.de) eine dynamische navigation. ich möchte gerne haben, dass wenn ich über die subnavigation fahre, der hintergrund von der hauptnavigation bleibt, also, dass er sich beim runterfahren in die subnav nicht wieder in den ursprungszustand zurücksetzt. kann mir da einer helfen? wenns geht möchte ich den untenstehenden code nicht dramatisch verändern. am besten wäre es, wenn ich nur einen kurzen befehl noch zwischenrein fügen muss. danke schon mal.

hier mein css:

ul#pages a{
 padding:11px 0 11px 0;
 margin:0 0 0 0;
 background-image:url(../img/nav1.png);
 font-weight:bold;
 font-size:15px;
 font-family:verdana,sans-serif;
 color:#000;
 text-decoration:none;
 display: block;
 width:180px;
 text-align:center;
}

ul#pages a:hover{
 padding:11px 0 11px 0;
 margin:0 0 0 0;
 background-image:url(../img/nav2.png);
 font-weight:bold;
 font-size:15px;
 font-family:verdana,sans-serif;
 color:#000;
 text-decoration:none;
 display: block;
 width:180px;
 text-align:center;
}

ul#pages li{
 list-style-type:none;
 float:left;
 position:relative;
}

ul#pages li ul{
 display:none;
 padding:0 0 0 0;
 margin:0 0 0 0;
}

ul#pages li:hover ul{
 display:block;
}

ul#pages li ul li{
 float:none;
}

ul#pages li ul li a{
 padding:1px 0 1px 0;
 margin:-1px 0 0 0;
 background-image:url(../img/subnav.png);
 font-weight:normal;
 font-size:13px;
 font-family:verdana,sans-serif;
 color:#000;
 text-decoration:none;
 text-align:left;
}

ul#pages li ul li a:hover{
 padding:1px 0 1px 0;
 margin:-1px 0 0 0;
 background-image:url(../img/subnav2.png);
 font-weight:normal;
 font-size:13px;
 font-family:verdana,sans-serif;
 color:#000;
 text-decoration:none;
 text-align:left;
}

gruß
sebastian schuppel

[Sebastian Schuppel]

kann mir keiner helfen?

[berdn]

Hallo Sebastian

vielleicht findes Du hier was ...
http://css.maxdesign.com.au/listamatic/

Dein problem ist, das Du den <a> mit deiner hover Eigenschaft belegt hast und nicht die Liste. Leider kann der IE 6 hover nur mit <a>.
Du kannst es ihm aber mit ein wenig JS "beibringen".

Z.B.

sfHover = function() {
 var sfEls = document.getElementById("mainNavigation").getElementsByTagName("LI");
 for (var i=0; i<sfEls.length; i++) {
  sfEls[i].onmouseover=function() {
   this.className+=" sfhover";
  }
  sfEls[i].onmouseout=function() {
   this.className=this.className.replace(new RegExp(" sfhover\b"), "");
  }
 }
}

if (window.attachEvent) window.attachEvent("onload", sfHover);

Liebe Grüße

Bernd

[Sebastian Schuppel]

das mit dem IE 6 ist mir bekannt, darum geht es nicht, der muss das nicht können, du hilfst mir mit deinem beitrag leider nicht, weil ich eine andere frage gestellt habe... sorry

[berdn]

Hallo Sebastian

also IE6 ist nicht relevant, OK.
Jetzt Nachdenken:

Du hast bei Elementen die eigenschaft hover definiert ...
Aber waren es auch die richtigen?

Steht doch eigentlich schon alles in deinem CSS ...
Und wenn Du den Bildwechsel auf den Href legst, ist doch klar das das Bild wieder wechselt wenn ich nicht mehr darüber bin.

Liebe Grüße,

Bernd

[imho_tep]

Hallo Sebastian,

nachdem ich Deine Seite angesehen habe, bin ich der Meinung, dass die Navi Dein geringstes Problem ist.

• im FF2 und im IE7 verschwindet links ein Teil des Inhalts, wenn man das Browserfenster verkleinert
• auf der Startseite nimmt der Titel für meinen Geschmack zu viel Platz ein, auch die Farbwahl ist suboptimal (grünes "g" auf grünem Hintergrund), und vom 'Deppen-Apostroph' solltest Du lassen.
• wenn Du ein Impressum bietest, dann gelten dafür bestimmte Regeln; ein E-Mail-Kontakt reicht nicht.
• last not least: es mangelt Deiner Seite an Content. Ich kann mir nicht vorstellen, was z.B. an Deinem Strundenplan fürs Web interessant sein soll. Von _Dir_ habe ich weder ein Bild noch Näheres dazu erfahren, wer Du bist, was Du machst, wo Du lebst usw.

Nimm diese Kritikpunkte nicht persönlich, sondern als Anregung, eine interessante Seite zu machen.

Best wishes, imho_tep

[Sebastian Schuppel]

die seite mach ich ja hauptsächlich nur aus spaß... die soll nicht für die ganze welt bestimmt sein