10 berichten aan het bekijken - 1 tot 10 (van in totaal 10)
  • Q:
    Bijdrager
    Es

    (PC) sitecheck alsjeblieft

    Hallo allemaal!
    Een paar dagen geleden bleek een CSS menu op PC’s het niet goed te doen (de submenus bleven leeg in IE6, ze bevatten om de een of andere vreemde reden geen tekst). Ik heb het aangepast en ben heel benieuwd of ie het nu wel doet….
    Dus heb je een PC staan; check even het menu alsjeblieft. De home heeft overigens geen submenus maar de anderen wel. En kun je me dan ook laten weten in welke browser je hem bekeken hebt?
    Alvast veel dank!!

    O ja; een link is wel handig, niet?

    http://www.esthermols.net/clients/clearwood/index.html

    Andere op- en aanmerkingen zijn natuurlijk ook welkom!

    edit// Ik heb hier een test-PC staan maar die is dus kapot en ik krijg alleen van die typische Windows schermen met de meest rare commandos te zien. Vandaar dat ik jullie hulp even inroep…

    Bijdrager
    Macs

    In Virtual PC (windows XP) komen de submenus wel op het scherm, maar niet onder de menus. M.a.w de submenus komen tussen twee menus te staan.

    Bijdrager
    Steff

    Hier doet die het prima in FF en IE op WinXP.

    Bijdrager
    Es
    ”Macs”

    In Virtual PC (windows XP) komen de submenus wel op het scherm, maar niet onder de menus. M.a.w de submenus komen tussen twee menus te staan.

    Ok. dank je! Duwen ze dan het hele menu opzij?

    Komt waarschijnlijk hierdoor:
    [code:1:ae93a17b81]#nav li ul { /* second-level lists */
    position: absolute;
    width: 150px;
    left: -999em; /* using left instead of display to hide menus because display: none isn’t read by screen readers */
    }

    #nav li:hover ul, #nav li.sfhover ul { /* lists nested under hovered list items */
    left: auto;
    }[/code:1:ae93a17b81]

    Of niet? Ik heb begrepen dat IE niet van absolute positioning houdt.
    Of zal ik toch maar display:none gebruiken? Want ik heb liever dat het ok is in IE dan dat screenreaders hetgoed doen…

    Bijdrager
    tennapel
    ”Es”

    Of niet? Ik heb begrepen dat IE niet van absolute positioning houdt.
    Of zal ik toch maar display:none gebruiken? Want ik heb liever dat het ok is in IE dan dat screenreaders hetgoed doen…

    IE houdt heel erg veel van absolute: position, dat is het probleem niet. Display: none gebruiken lijkt me ook geen goede optie.

    Er is echter voor dit type menu een standaard oplossing die perfect werkt:
    http://www.alistapart.com/articles/dropdowns/

    Bijdrager
    Es
    ”tennapel”

    Er is echter voor dit type menu een standaard oplossing die perfect werkt:
    http://www.alistapart.com/articles/dropdowns/

    Die heb ik ook gebruikt. Althans, deze versie daarop:
    http://www.htmldog.com/articles/suckerfish/dropdowns/

    Deze refereert aan degene die jij noemt en voegt daar nog aan toe:

    The original Suckerfish Dropdowns article published in A List Apart proved to be a popular way of implementing lightweight, accessible CSS-based dropdown menus that accommodated Internet Explorer by mimicking the :hover pseudo-class.

    Well now they’re back and they’re more accessible, even lighter in weight (just 12 lines of JavaScript), have greater compatibility (they now work in Opera and Safari without a hack in sight) and can have multiple-levels.

    Bij Alistapart gebruiken ze overigens wel:
    [code:1:1ae0c075c8]li ul {
    display: none;
    position: absolute;
    top: 1em;
    left: 0;
    }[/code:1:1ae0c075c8]

    Bijdrager
    tennapel

    mhmm… ik zou geen standaard display : none gebruiken, tenzij je zeker weet dat de gebruikte CSS geen problemen oplevert.

    Dat zou betekenen dat je zoiets zou moeten doen:
    [code:1:c82baa1f69]
    #nav li ul {
    display : none;
    }

    * html #nav li ul {
    display : block;
    }
    [/code:1:c82baa1f69]

    en dan in de javascript voor IE een regel maken die de style display:none toepast op het element.

    Op die manier weet je zeker dat het werkt, ook als javascript uitgeschakeld is in IE; dan werken de hover namelijk helemaal niet.

    Bijdrager
    Es
    ”tennapel”

    en dan in de javascript voor IE een regel maken die de style display:none toepast op het element.

    Dat is makkelijker gezegd dan gedaan… Ik ben een ontwerper die wat kan html-en en intussen ook CSS-en. Ik kan ook wel wat code lezen maar zelf “verzinnen”.. dat kan ik helaas niet.

    ”tennapel”

    Op die manier weet je zeker dat het werkt, ook als javascript uitgeschakeld is in IE; dan werken de hover namelijk helemaal niet.

    Dat heb ik proberen te ondervangen door in de content pagina’s ook links te maken die naar de volgende submenus leiden. Zo kan toch iedereen alle pagina’s bekijken. Is niet zo elegant maar het werkt in ieder geval.

    Verder heb ik nu dit gedaan, en hopelijk staan de sub-items nu wel op hun plaats in IE op de PC:

    [code:1:f26892fa50]#nav li:hover ul, #nav li.sfhover ul { /* lists nested under hovered list items */
    left: 0px;
    top:30px;
    }[/code:1:f26892fa50]

    ipv

    [code:1:f26892fa50]#nav li:hover ul, #nav li.sfhover ul {
    left: auto;
    }[/code:1:f26892fa50]

    en ik heb de #nav li een position: relative gegeven.

    Bijdrager
    tennapel

    Werkt prima in IE6 en ook in IE7 beta 2.

    Bijdrager
    Es
    ”tennapel”

    Werkt prima in IE6 en ook in IE7 beta 2.

    Dank je! Dan doet ie het iig in de meest gebruikte browsers.

10 berichten aan het bekijken - 1 tot 10 (van in totaal 10)

Je moet ingelogd zijn om een reactie op dit onderwerp te kunnen geven.