[Erledigt] CSS und Javascript Dropdown Menu IE PROBLEM

unreal87 · 18.05.2010, 20:51

Hallo an alle,

ich habe da ein Problem mit meinem Dropdown Menu.
Unter FF wird es perfekt und richtig angezeigt.
Aber unter IE wird das Dropdown angezeigt, sobald man aber dadrauf gehen möchte geht es sofort wieder zu.

Hier mal die Codes:
CSS Code

Code:

ul.dropdown
{
    list-style: none;
    margin:0;
    padding:0;
    width:50%;
    z-index:99;
}

ul.dropdown * ul
{
    list-style: none;
    margin:0;
    padding: 0;
	display:none;
	position:absolute;
	z-index:99;
	width:20em;
}

ul.dropdown li
{
    float:left;
}

ul.dropdown li * li
{
    border:1px solid #fff;
    float:none;

    position: relative;
}

ul.dropdown ul * ul
{
    left:98%;
    top:0;

}

ul.dropdown a
{
    display:block;

}

ul.dropdown ul * a
{
    height:100%;
}

ul.dropdown li:hover ul ul, ul.dropdown li:hover ul ul ul, ul.dropdown li:hover ul ul ul ul
{
    display:none;
}

ul.dropdown li:hover ul, ul.dropdown ul li:hover ul, ul.dropdown ul ul li:hover ul
{
    display:block;
}

Javascript Code

Code:

function enableDropdownMenuForIE()
{
    if (document.all)
	{
        uls = document.getElementsByTagName('UL');

        for(i = 0; i < uls.length; i++)
        {
            if (uls[i].className == 'dropdown')
            {
                var lis = uls[i].getElementsByTagName('li');

                for (j = 0; j < lis.length; j++)
                {
                    if(lis[j].lastChild.tagName == 'UL')
                    {
                        lis[j].onmouseover = function() { this.lastChild.style.display = 'block'; }
                        lis[j].onmouseout = function() { this.lastChild.style.display = 'none'; }
                    }
                }
            }
        }
    }
}

und als letztes der HTML Code

Code:

    <body onLoad="enableDropdownMenuForIE();">
      <ul class="dropdown" id="mainmenu">
        <li>
            <a href="/prfr/index.htm" class="Stil21"><strong>Home</strong></a>
            <ul>
            </ul>
        </li>

        <li>
            <a href="" class="Stil21"><strong>Technologies</strong></a>
            <ul>
                <li><a href="?site=static&staticID=10">Systemes de BCC</a></li>
                <li><a href="?site=static&staticID=8">Cours de formation Systemes de BCC</a>
                <li><a href="?site=static&staticID=14">Catalogue technologie de ciment, beton et mortier</a></li>
                <li><a href="?site=static&staticID=13">Catalogue technologie du beton leger</a></li>
                <li><a href="?site=static&staticID=9">CCM Technologies</a></li>
                <li><a href="?site=static&staticID=5">Protect Room</a></li>
                <li><a href="?site=static&staticID=12">Projet de logement public</a></li>
                <li><a href="?site=static&staticID=12">L'energie solaire</a></li>
     </ul>
        </li>

und soweiter

Kann mir jemand vielleicht sagen, was nicht daran passt??

Vielen Vielen Dank im Voraus

Viele Grüße

ChrisB · 19.05.2010, 12:58

Zitat:

Zitat von unreal87

Kann mir jemand vielleicht sagen, was nicht daran passt??

mouseout feuert, sobald du vom Element auf ein Nachfahrenelement gehst.
Das müsstest du also abfangen, indem du das target des Events einbeziehst.

Der IE kennt aber zwei Events mouseenter/mouseleave, mit denen sich das ganze einfacher realisieren lässt, weil die wirklich auf das reagieren, was der naiven Erwartungshaltung entspricht.

unreal87 · 19.05.2010, 16:12

Hallo ChrisB, danke für dein Feedback.
Könntest du mir sagen wie das dann aussehen muss, da ich nicht wirklich so den durchblick von php und css habe.

Vielen Dank

ChrisB · 19.05.2010, 19:20

Zitat:

Zitat von unreal87

Könntest du mir sagen wie das dann aussehen muss, da ich nicht wirklich so den durchblick von php und css habe.

PHP ist irrelevant, HTML und CSS sind wesentlich, JavaScript kommt optional für ältere IE hinzu.
Wenn dir in einem der Bereiche Grundlagenwissen fehlt, eigne es dir bitte an.

Bei konkreten Problemen mit der Umsetzung helfen wir dann gerne weiter.

Themen-Optionen
Druckbare Version zeigen Jemanden per E-Mail auf dieses Thema hinweisen
Thema bewerten
Thema bewerten:

Ähnliche Themen
Thema	Autor	Forum	Antworten	Letzter Beitrag
[Erledigt] Dropdown menu: Nach dem Auswahl sollte die Auswlliste immer noch zur Verfü	shar_muur	PHP Tipps 2010	1	21.02.2010 13:08
[Erledigt] CSS Drop Down Menü und IE Problem	gombi	HTML, Usability und Barrierefreiheit	10	18.01.2010 15:54
auswahl aus dropdown menü in vaiable übergeben und wieder anzeigen	Bexsta	PHP Tipps 2009	18	14.10.2009 23:52
Problem mit einbindung von javascript auf einer php seite	mysteryxxx	PHP Tipps 2009	7	01.02.2009 16:40
1101: 10x JavaScript und kein Ende ist abzusehen…	Nikolaus 2.0	Adventskalender 2008	9	13.12.2008 20:11
horizontales Menü	Fritz73	Scriptbörse	9	26.05.2008 22:26
JavaScript Navigations Menü	andiR	HTML, Usability und Barrierefreiheit	4	30.08.2006 12:28
problem mit javascript und smarty	snatch-ic	HTML, Usability und Barrierefreiheit	2	08.06.2006 22:11
Dropdown Menü Grösse ändern	Mike55	PHP Tipps 2005-2	2	06.10.2005 21:05
[Erledigt] Mouseover Menü in Javascript und PHP Lösung ?		PHP Tipps 2005-2	4	20.07.2005 08:48
Mit JS DropDown Menü füllen?		HTML, Usability und Barrierefreiheit	3	13.06.2005 16:04
Dropdown Menü ersten Entrag löschen?[gelöst]		PHP Tipps 2005-2	2	08.06.2005 10:19
Problem mit Menü	nullplan	PHP Tipps 2005	1	24.03.2005 22:11
DropDown Menu	JeeZ	HTML, Usability und Barrierefreiheit	1	19.06.2004 17:15


Mister Ad PHP Code Flüsterer Registriert seit: 21.08.2005 Beiträge: 4682 PHP-Kenntnisse: Fortgeschritten

19.05.2010, 16:12
unreal87 Neuer Benutzer Registriert seit: 18.05.2010 Beiträge: 2 PHP-Kenntnisse: Anfänger	Hallo ChrisB, danke für dein Feedback. Könntest du mir sagen wie das dann aussehen muss, da ich nicht wirklich so den durchblick von php und css habe. Vielen Dank