ID=Current in Navigation

S

Saro

Mitglied
Thread Starter
Dabei seit
14.11.2005
Beiträge
46
Reaktionspunkte
0
Tach!

also ich bin nicht der absolute Crack mit CSS, aber meistens bekomme ich es irgendwie hin!

Aber nun, weiß ich nicht weiter:
Ich habe mir ein FLYOUT-Navigations-Menu gebaut (mit großer Hilfe ausm Forum und über andere Seiten).
Nun habe ich den html-Seiten, auf denen der User sich befindet, die ID=Current verpasst.
Sie werden nun auch farblich anders dargstellt. Allerdings schaffe ich es nicht, dass das FLYOUT-MENU auch sichtbar bleibt (ohne dass man mit der Maus drüber hovert).
Ich weiß nicht was ich in der CSS hinzufügen muss, damit es richtig gelesen wird...?

Ich bekomms leider nicht hin, und dachte vielleicht kann mir hier jemand helfen

Also hier mal CSS:
Code:
#container {
    width:695px;
    padding:0px;
}
#menu {
    font-family: "News Gothic MT", Helvetica, Arial, sans-serif;
    width:120px;
    position:relative;
    margin:0;
    font-size:10px;
}
#menu ul li a, 
#menu ul li a:visited {
    display:block;
    text-decoration:none;
    color:#000;
    width:120px;
    border-width:0px 0px 1px 0;
    background:#fff;
    font-size:10px;
    padding-left:10px;
    height: 15px;
    line-height: 15px;
}
#menu ul {
    padding:0; 
    margin:0;
    list-style-type: none;
}
#menu ul li {
    float:left;
    position:relative;
    border-bottom: solid #000 thin;
}
#menu ul li ul {display: none;}
 
#menu table {border-collapse:collapse; border:0; margin:0; padding:0;}
 
#menu ul li:hover a,
#menu ul li a:hover {
    color:#000000;
    border-bottom: solid #000 thin;
}
 
#menu ul li:hover ul,
#menu ul li a:hover ul {display:block; position:absolute; top:0; left:130px; width:565px; background: transparent;}
 
#menu ul li:hover ul li,
#menu ul li a:hover ul li {float:left;}
 
#menu ul li:hover ul li a,
#menu ul li a:hover ul li a {display:block; color:#999999; width:130px; float:left;}
 
#menu ul li:hover ul li a.sub,
#menu ul li a:hover ul li a.sub {color:#000;}
 
#menu ul li:hover ul li a:hover,
#menu ul li a:hover ul li a:hover {color:#000;}
 
#menu ul li:hover ul li ul,
#menu ul li a:hover ul li a ul {visibility:hidden; position:absolute; width:200px;}
 
#menu ul li:hover ul li:hover ul,
#menu ul li a:hover ul li a:hover ul {visibility:visible; left:-1px; top:31px; color:#000;}
 
#menu ul li:hover ul li:hover ul li a,
#menu ul li a:hover ul li a:hover ul li a {display:block; width:200px; color:#000; border-left:1px solid #eee;}
 
#menu ul li:hover ul li:hover ul li a:hover,
#menu ul li a:hover ul li a:hover ul li a:hover {background:#bd8d5e; color:#fff;}
 
#menu ul li a#current, 
#menu ul li a#current:link,
#menu ul li ul a#current,
#menu ul li ul a#current:link
{
    color: #000000;
    cursor: default;
    font-weight: bold;
    border-bottom: 1px solid #000;
    visibility:visible;
    display:block
}
 
#menu ul li a#current:hover
{
    border-bottom: 1px solid #000;
    color: #000000;
}

und die html:
Code:
<div id="navcontainer">
            <div id="menu"><ul>
            <li id="active"><a href="vita.html" title="VITA" id="current">V I T A<!--[if IE 7]><!--></a><!--<![endif]-->
    <!--[if lte IE 6]><table><tr><td><![endif]-->
    <ul>
        <li><a href="vita_basics.html" title="BASICS">B A S I C S</a></li>
        <li id="active"><a href="vita_theater.html" title="THEATER" id="current">T H E A T E R</a></li>
        <li><a href="vita_film.html" title="FILM">F I L M</a></li>
        <li><a href="vita_sprache.html" title="AUDIO">S P R A C H E</a></li>
    </ul>
    <!--[if lte IE 6]></td></tr></table></a><![endif]-->
    </li>
    <li><a href="demo.html">D E M O S
      <!--[if IE 7]><!--></a><!--<![endif]-->
    <!--[if lte IE 6]><table><tr><td><![endif]-->
    <ul>
        <li><a href="demo_film.html" title="FILM">F I L M</a></li>
        <li><a href="demo_audio.html" title="AUDIO">A U D I O</a></li>
        </ul>
    <!--[if lte IE 6]></td></tr></table></a><![endif]-->
    </li>
    <li><a href="photos.html">P H O T O S <!--[if IE 7]><!--></a><!--<![endif]-->
    <!--[if lte IE 6]><table><tr><td><![endif]-->
    <ul>
        <li><a href="photos_portrait.html" title="PORTRAITSPHOTOS">PORTRAITS</a></li>
 
        <li><a href="photos_theater.html" title="THEATERPHOTOS">THEATER</a></li>
    </ul>
    <!--[if lte IE 6]></td></tr></table></a><![endif]-->
    </li>
    <li><a href="kontakt.html">K O N T A K T <!--[if IE 7]><!--></a><!--<![endif]-->
    <!--[if lte IE 6]><table><tr><td><![endif]-->
    </ul>
</div>
    </div>

Der Ein oder Andere schüttelt sicher ungläubig den Kopf bei diesen Codes. Ich bitte um Nachsicht. Wie geschrieben, bin kein Profi
Bei ganz groben Fehlern, wäre ich trotzdem froh über Hinweise


DANKE!

LG
*R
 
Zurück
Oben Unten