Dropdown-Menü verschiebt unteren Inhalt im DIV

Wutaler

Mitglied
Guten Abend,

ich habe eine Problem mit meinem JQuery Drop-Down Menü.
Ich hab auch schon eine weile gegooglelt und dort immer wieder Lösungen gefunden die mit Postition: ABSOLUTE/RELATIVE zu tun haben, aber irgendwie funktionieren diese Lösungsansätze bei meiner Version nicht. Eventuell hat einer von euch eine gute Idee?

Das ist mein Javascriptcode:
Javascript:
$(document).ready(function(){
     $('li').hover(function(){
          $(this).find('ul>li').fadeToggle(200);
     });
});

Das ist mein CSS-Code:
Code:
#menue_container ul li {
    float: left;
    width: 140px;
    line-height: 40px; /* Height in Wrapper anpassen */
    text-align: center;
}

#menue_container ul li a {
    font-weight: bold;
    color: #FFFFFF;
}

#menue_container ul li li {
    background: #000000;
    display: none;
}

#menue_container ul li li:hover {
    background: #555;
}

Und zum schluss Mein HTML-Code:

HTML:
    <div id="menue_container">
        <ul>
            <li><a href="">Home</a>
                <ul>
                    <li><a href="">Home 1</a></li>
                    <li><a href="">Home 2</a></li>
                </ul>
            </li>
          
            <li><a href="">Aktuelles</a></li>
          
            <li><a href="">Training</a>
                <ul>
                    <li><a href="">Training 1</a></li>
                    <li><a href="">Training 2</a></li>
                    <li><a href="">Training 3</a></li>
                    <li><a href="">Training 4</a></li>
                </ul>
            </li>

            <li><a href="">Galerie</a>
                <ul>
                    <li><a href="">Galerie 1</a></li>
                    <li><a href="">Galerie 2</a></li>
                    <li><a href="">Galerie 3</a></li>
                    <li><a href="">Galerie 4</a></li>
                </ul>
            </li>
          
            <li><a href="">Presse</a>
                <ul>
                    <li><a href="">Presse 1</a></li>
                    <li><a href="">Presse 2</a></li>
                </ul>  
            </li>
          
            <li><a href="">Shop</a></li>
        </ul>
    </div> <!--End-Menue_Container-->


Eventuell bin ich auch einfach nur "CodeBlind" nach dem ganzen Tag tippen..
 
Dropdown-Menü verschiebt unteren Inhalt im DIV

Ich hab auch schon eine weile gegooglelt und dort immer wieder Lösungen gefunden die mit Postition: ABSOLUTE/RELATIVE zu tun haben, aber irgendwie funktionieren diese Lösungsansätze bei meiner Version nicht.
Kommt nur darauf an, wie dies konkret angewendet wird.
CSS:
#menue_container ul {position:relative}
#menue_container ul ul {position:absolute}
...funktioniert in deiner Version einwandfrei; der nachfolgende Inhalt wird beim Öffnen eines Submenüs nicht mehr nach unten verschoben :)
 
Ja, das hatte ich auch schon, aber dann ist das Menü was eingeblendet werden soll in einer Reihe und nicht mehr untereinander...
 
Ich sollte ins Bett gehen. Genau das hatte ich eben auch eingetippt, aber an einer falschen Stelle.
Ich danke dir vielmals für deine Hilfe!!!
 
Zurück