kunert0345: menü klappt mit "active" auf aber nicht mit "focus".

Beitrag lesen

hallo,

problem: css menü klappt mit "active" aber sobald ich das mit "focus" versuche damit es offen bleibt klappt es zussamen.

frage: was kann ich tun damit das menü offen bleibt.

anmerkung: ich versuche gezielt auf javascript zu verzichten und es ist mir egal ob der IE-explorer damit problehme hatt.

seite mit "li:active"

<html>  
 <head>  
<!-- USED BUGDETECTION PROGRAMMS: HTML= http://validator.w3.org/ ; CSS=  http://jigsaw.w3.org/css-validator/validator.html.en ; JavaScript= http://developer.netscape.com/docs/manuals/jsdebug/index.htm -->  
  <meta http-equiv="content-type" content="text/html; charset=ISO-8859-1">  
  <meta name="rights" content="MW-PRUDUCTION, Zef">  
  <meta name="author" content="Zef, CO">  
  <meta name="description" content="...">  
  <meta name="robots" content="noindex">  
  <meta name="robots" content="nofollow">  
  <meta http-equiv="expires" content="0">  
  <meta name="DC.creator" content="Zef">  
  <meta name="DC.publisher" content="MW-PRODUCTION">  
  <meta name="DC.language" content="de">  
  <meta name="DC.rights" content="MW-PRUDUCTION, Zef">  
  <link rel="shortcut icon" href="data/1.png">  
  <title>XD</title>  
  <style type="text/css">  
   body {  
    margin:0; padding:0;  
    background-color:#000000;  
    font-family:Courier New; text-transform:uppercase;  
   }  
   * {  
     color:#00FF00;  
   }  
   div#aa {  
    font-weight:bold;  
    float:left; width:15%;  
    list-style:none;  
    }  
   div#aa a {  
    display:block;  
    text-decoration:none;  
    }  
   div#aa a:hover {  
    background-color:#404040;  
    }  
   div#aa a:focus {  
    background-color:#00FF00; color:#000000;  
    }  
   div#aa li p {  
    display:none;  
    }  
   div#aa li hr {  
    display:none;  
    }  
   div#aa li:active p {  
    display:block;  
    margin:0;  
    border-bottom:solid;  
    border-width:thin;  
    border-color:#000000;  
    background-color:#001400;  
    }  
   div#aa li:active hr {  
    display:block;  
    margin:0;  
    border-style:solid;  
    }  
   iframe {  
    width:83%; height:100%;  
    border-style:solid; border-width:thick;  
    border-top:none; border-bottom:none; border-right:none;  
    }  
  </style>  
 </head>  
 <body>  
  <div id="aa">  
   <li><a href="home/index.html" target="iframe">home</a>  
    <p><a href="">123</a></p>  
    <p><a href="">123</a></p>  
    <p><a href="">123</a></p>  
    <p><a href="">123</a></p>  
    <hr>  
   </li>  
   <li><a href="video/index.html" target="iframe">video</a>  
    <p><a href="">123</a></p>  
    <p><a href="">123</a></p>  
    <p><a href="">123</a></p>  
    <p><a href="">123</a></p>  
    <p><a href="">123</a></p>  
    <p><a href="">123</a></p>  
    <p><a href="">123</a></p>  
    <p><a href="">123</a></p>  
    <p><a href="">123</a></p>  
    <hr>  
   </li>  
   <li><a href="music/index.html" target="iframe">music</a>  
    <p><a href="">123</a></p>  
    <p><a href="">123</a></p>  
    <p><a href="">123</a></p>  
    <p><a href="">123</a></p>  
    <p><a href="">123</a></p>  
    <p><a href="">123</a></p>  
    <p><a href="">123</a></p>  
    <p><a href="">123</a></p>  
    <p><a href="">123</a></p>  
    <hr>  
   </li>  
   <li><a href="forum/index.html" target="iframe">forum</a></li>  
   <li><a href="chat/index.html" target="iframe">chat</a></li>  
   <li><a href="download/index.html" target="iframe">download</a>  
    <p><a href="">123</a></p>  
    <hr>  
   </li>  
  </div>  
  
  <iframe src="home/index.html" name="iframe">  
    <p>IFRAME ERROR</p>  
  </iframe>  
  
 </body>  
</html>