Gangsta
Neues Mitglied
Hallo an alle da draußen, ich bräuchte eure Hilfe und es wär super wenn wer ne Lösung weiß..
Also ich hab einfach ne Liste erstellt, welche mit Hover auf und zugeklappt wird und habe es auch (einigermaßen) hinbekommen, dass das in einem halbwegs akzeptablen Zustand aussieht. Nur das Problem ist, wenn die Subbuttons, das "Untermenü", erscheint, und ich mit der Maus dann zu denen will, verschwinden diese auch gleich wieder.
Google bereits wie ein Verrückter, hab allerdings nichts akzeptables gefunden...
Hier mal der Code:
Ein Beispiel: http://ganpac10.bplaced.net/anderes/test.html
Bin für jede Hilfe seehr dankbar, bin grad am verzweifeln :S
lg Gangsta
Also ich hab einfach ne Liste erstellt, welche mit Hover auf und zugeklappt wird und habe es auch (einigermaßen) hinbekommen, dass das in einem halbwegs akzeptablen Zustand aussieht. Nur das Problem ist, wenn die Subbuttons, das "Untermenü", erscheint, und ich mit der Maus dann zu denen will, verschwinden diese auch gleich wieder.
Google bereits wie ein Verrückter, hab allerdings nichts akzeptables gefunden...
Hier mal der Code:
HTML:
<html>
<head>
<script src="http://code.jquery.com/jquery-latest.js"></script>
<link rel="stylesheet" type="text/css" href="test.css"/>
</head>
<body>
<div id="Rahmen">
<ul id="Navigation">
<div class="menu1">
<li >Milk
<ul id="untermenu1"><li id="hauptunt">
<div id="outputId1" style="display: none;">2text</div>
<div id="outputId2" style="display: none;">3text</div>
<div id="outputId3" style="display: none;">4text</div>
<div id="outputId4" style="display: none;">4text</div>
<div id="outputId5" style="display: none;">4text</div>
<div id="outputId6" style="display: none;">4text</div></li>
</ul></li>
</div>
<li>Bread</li>
<li >Chips</li>
<li class="menu2">Socks
<ul><li class="untermenu2">sdsafchinken</li>
<li class="untermenu2">sadfasdf</li>
</ul></li>
</ul>
</div>
<script>
Code:
function fnFx(arrIDs){
$("#"+arrIDs[0]).fadeIn("slow", function(){
fnFx($.map(
arrIDs,
function(elementOfArray, indexInArray){
return ((indexInArray==0)? null: elementOfArray);
})
);
});
}
$("ul#Navigation li ul#untermenu1 li").css("position", "absolute");
$("ul#Navigation li ul#untermenu1 li").css("opacity", "0");
$("ul#Navigation div.menu1").hover(function () {
fnFx(['outputId1', 'outputId2', 'outputId3', 'outputId4', 'outputId5', 'outputId6']);
$("ul#Navigation li ul#untermenu1 li").animate({
"left": "+=50px",
opacity: 1,
}, "1000");
fnFx(['outputId1', 'outputId2', 'outputId3']);
},
function() {
$("#outputId1").fadeOut("slow");
$("#outputId2").fadeOut("slow");
$("#outputId3").fadeOut("slow");
$("#outputId4").fadeOut("slow");
$("#outputId5").fadeOut("slow");
$("#outputId6").fadeOut("slow");
$("ul#Navigation li ul li#hauptunt").animate({
"left": "-=50px",
opacity: 1
}, "1000");
}
);
HTML:
</script>
</body>
</html>Ein Beispiel: http://ganpac10.bplaced.net/anderes/test.html
Bin für jede Hilfe seehr dankbar, bin grad am verzweifeln :S
lg Gangsta
