tutorials.de Buch-Aktion 05/2012
ERLEDIGT
JA
ANTWORTEN
6
ZUGRIFFE
477
EMPFEHLEN
  • An Twitter übertragen
  • An Facebook übertragen
AUF DIESES THEMA
ANTWORTEN
  1. #1
    dobber812 dobber812 ist offline Mitglied Silber
    Registriert seit
    May 2008
    Beiträge
    75
    Hy,

    ich habe ein horizontales css Menü, welches im FF und im IE8 wunderbar funktioniert.

    Nur in älteren IE -Version habe ich erhebliche Probleme:

    IE.5 und 6 - Es wird nur ein großer "weisser" Kasten ausgegeben, Menüpunkte können nicht angewählt werden

    IE.7 - Die Sub-Menüpunkte werden jeweils bei dem nächsten Haupt-Menüpunlt aufgeklappt...

    Ich nehme an das wird mit IF-IE gelöst aber ich finde leider die Rätsels Lösung nicht

    Code :
    1
    2
    3
    4
    5
    6
    7
    8
    9
    10
    11
    12
    13
    14
    15
    16
    17
    18
    19
    20
    21
    22
    23
    24
    25
    26
    27
    28
    29
    30
    31
    32
    33
    34
    35
    36
    37
    38
    39
    40
    41
    42
    43
    44
    45
    46
    47
    48
    49
    50
    51
    52
    53
    54
    55
    56
    57
    58
    59
    60
    61
    62
    63
    64
    65
    66
    67
    68
    69
    70
    71
    72
    73
    74
    75
    76
    77
    78
    79
    80
    81
    82
    83
    84
    85
    86
    87
    88
    89
    90
    91
    92
    93
    94
    95
    96
    97
    98
    99
    100
    101
    102
    103
    104
    105
    106
    107
    108
    109
    110
    111
    112
    113
    114
    115
    116
    117
    118
    119
    120
    121
    122
    123
    124
    125
    
    css
    ul.menu, li.menu {
        list-style-type: none;
        margin: 0px;
        padding: 0px;
    }
     
     
    #header_menu {
    position: absolute;
     margin-left: 20px;
    background:#555;
    }
     
    #header_menu li {
    line-height: normal;
    }
     
    ul#header_menu  {
    z-index: 10; 
    clear: both;}
     
    #nav {
        height: 45px;
    }
     
    #nav ul {
        list-style-type: none;
        margin: 0;
        padding: 0;
        font-size: 12px;
        width: auto;
        position: relative;
    }
    #nav ul li {
        float: left;
        color: #fff;
        text-align: center; 
        font-weight: normal;
        background: #fff url(menu.gif) no-repeat bottom left;
        }
     
    #nav ul li a {
    background-image:url(menu.png);
    background-repeat:repeat-x;
    display:block;
    padding:15px 15px 2px 20px;
    text-decoration:none;
    height:28px;
    font-weight: bold
    }
     
     
    #nav ul li a:hover, #nav li a:focus {}
     
    #nav li a:active, #nav ul li a.active {
    background: #d1d2d4;
     border-color: #fff; 
    color: #4b4c4d;}
     
     
    #nav li.menu-current a{
         background: #fff url(menu.gif) no-repeat bottom left;
        color:#012a9f;
        font-size:12px;
        height:28px;
        padding:15px 15px 2px 20px;
        text-decoration:none;
        font-weight: bold;
    }
     
    #nav li.menu-current a{
    font-weight: bold;
    } 
     
     
    [B]#nav .menu li ul {
    position: absolute;
     width: 12em; 
    margin: 0; 
    display: none;
     text-transform: none;
     font-size: 12px;}
    [/B]
    #nav .menu li ul li {
    width: 12em; 
    text-align: left; 
    font-weight: normal; 
    margin: 0; 
    padding: 0; 
    line-height: 1.2em;}
     
     
    #nav .menu li ul a {
        width: 11.5em;
        padding: .6em .1em .6em .4em;
        color: #012a9f;
        border: 0;
    }
     
     
    #nav .menu li ul a:hover {
        color: #012a9f;
        border: 0;
        color:#012a9f;
    }
     
     
    #nav .menu li:hover ul, #nav .menu li a:focus ul, #nav .menu li.subMenu ul {display: block;}
    #nav .menu li ul ul { display: none;}
    #nav .menu li:hover ul ul, #nav .menu li.subMenu ul ul {display: none;}
    #nav .menu li:hover ul, #nav .menu li li:hover ul, #nav .menu li.subMenu ul, #nav .menu li li.subMenu ul {display: block;}
     
     
     
    #nav .menu li ul li ul li a     { width: 11.5em; padding: .6em .1em .6em .4em; background: #c6c6c6; color: #fff; }
     
     
    #nav li {position: relative;}
     
    #nav ul ul ul {
        position: absolute;
        top: 1px;
        left: 100%;
    }

    Wie bekomm das ich in den o.g. IE Versionen korrekt angezeigt?
    Besten Dank
    LG
     

  2. #2
    Maik Tutorials.de Gastzugang
    Hi,

    steht das Menü irgendwo online zur Verfügung?

    Desweiteren kannst du dich mal mit Alternative CSS-Dateien für den Internet Explorer (Conditional Comments) näher beschäftigen.

    mfg Maik
     

  3. #3
    dobber812 dobber812 ist offline Mitglied Silber
    Registriert seit
    May 2008
    Beiträge
    75
    Hy,

    nein ist leider noch nicht online, habe das menü von einem älteren Projekt übernommen (leider auch wieder offline) und dort konnte das Problem durch die csshover.htc auf einen" klatsch" erledigt werden, nur hier scheint das nicht zu klappen...
    ...dabei wurden nur die Hhintrgrundgrafiken und die Größenangaben etwas verändert, mehr nicht...

    Deshalb verwundert mich das ein wenig, laut dem Quellcode wird diese Datei auch ordnungsgemäß "eingebunden" (mit If-ie) jedoch wirkt sich das absolut nicht aus.

    puhh
     

  4. #4
    Maik Tutorials.de Gastzugang
    Zitat Zitat von dobber812 Beitrag anzeigen
    IE.5 und 6 - [...] Menüpunkte können nicht angewählt werden
    Zitat Zitat von dobber812 Beitrag anzeigen
    dort konnte das Problem durch die csshover.htc auf einen" klatsch" erledigt werden, nur hier scheint das nicht zu klappen...
    ...dabei wurden nur die Hhintrgrundgrafiken und die Größenangaben etwas verändert, mehr nicht...
    Das riecht nach dem "IE Link bug" bei semitransparenten PNGs, der sich bei gewissen Bilddimensionen einstellt, und zur Folge hat, dass das Element nicht mehr geklickt werden kann.

    Im Abschnitt "Addendum: IE Link bug" des Artikels Cross-browser semi-transparent backgrounds findest du eine tabellarische Übersicht, bei welchen Dimensionen dies der Fall ist, und bei welchen nicht.

    mfg Maik
     

  5. #5
    dobber812 dobber812 ist offline Mitglied Silber
    Registriert seit
    May 2008
    Beiträge
    75
    ... wenn ich das richtig verstehe, würde das mit Tranzparenzen zutun haben, ich habe jedoch auf Tranzparenzen verzichtet... zum Einsatz kommen ganz "normale" png Grafiken...

    Grüße
     

  6. #6
    Maik Tutorials.de Gastzugang
    Achso..., dann hab ich da was mißverstanden.

    Naja, bevor wir uns nun den Kopf darüber zerbrechen, wie du hier den einzelnen IE-Versionen beikommen kannst, schlage ich vor, das Menü neu aufzusetzen.
    bereitet in der IE-Familie keine Probleme.

    Und mal ganz ehrlich, wer benutzt denn heute noch den IE5.x (Win95 / Win98)? Selbst der IE6 (Win2k / WinXP) ist mittlerweile ein "Auslaufmodell", ist man doch aktuell beim IE8 angekommen.

    mfg Maik
     

  7. #7
    dobber812 dobber812 ist offline Mitglied Silber
    Registriert seit
    May 2008
    Beiträge
    75
    War ja garnicht so falsch, wollte auch eig. zuerst ein trazparentes Menü erstellen

    Na dann werde ich mal das Menü aus dem alten Projekt nehmen und nach dem Ausschlussverfahren vorgehen und die Formatierungen Schritt für Schritt übernehmen.

    Es gibt leider immernoch einige Leute die ihren IE nicht updaten... man möchte es halt allen recht machen und den satz: "optimiert für IE8" setzt ich nicht auf die Seite

    Den IE7 möchte ich jedenfalls noch mit ins Boot nehmen.

    Ich "erledige" meine Anfrage hier mal, werde jedoch das Ergebniss posten wenn ich es habe

    LG
     

Ähnliche Themen

  1. Horizontales Menü
    Von Alex_T im Forum CSS
    Antworten: 3
    Letzter Beitrag: 05.08.10, 17:22
  2. Horizontales Menü IE7
    Von dobber812 im Forum CSS
    Antworten: 1
    Letzter Beitrag: 03.02.10, 17:47
  3. Dynamsiches horizontales Menü
    Von Fullku im Forum CSS
    Antworten: 1
    Letzter Beitrag: 23.06.08, 12:23
  4. Horizontales Menü (ohne JS/htc) ?
    Von soyo im Forum CSS
    Antworten: 40
    Letzter Beitrag: 14.12.06, 14:17
  5. horizontales Menü mit CSS
    Von [desty] im Forum CSS
    Antworten: 2
    Letzter Beitrag: 23.05.06, 20:35