[jayzee]

Hej,

håller på med en 2-stegs meny jag inte blir riktigt klok på... Hur specificerar jag vilka länkar (innehåll) som skall läggas in i #submenu på ett fint sätt (inga fullösningar) för varje länk? Problemet är att jag kör bundit click eventen och kan inte skicka inparametrar då till funtionen...

<nav id="menu">
  <ul>
    <a href="sida1.html"><li>Klick 1</li></a>
    <a href="sida2.html"><li>Klick 2</li></a>
    <a href="sida3.html"><li>Klick 3</li></a>
  </ul>
</nav>
<div id="submenu"></div>

<script type="text/javascript">
$(document).ready(function() {
 $("#menu li").click(function(event) {
    if($("#submenu").is(":hidden"))
      $("#submenu").empty().html("LÄNKAR SOM SKALL IN").show();
    else $("#submenu").hide();
  });
});
</script>

[andi]

Varför måste du skapa submenyn dynamiskt? Det måste väl vara lättare att skapa en nästlad lista direkt så kan du använda JQuery enbart för att visa de olika menyerna samt event-hantering?

[jayzee]

Visst är det enklare så, men lösningen som du nämner passar bäst när man har hover menyer, vilket jag inte har. Problemet är att man isf. har en osynlig nästlad lista innehållandes undermenyns innehåll under varje länk och där listans innehåll måste ändå flyttas till #submenu elementet, vilket gör att det blir "kaka på kaka"

[fabian]

Jag får nog hålla med om att det låter betydligt smartare att ha hela menyn i html, och istället jobba med att dölja/visa olika delar av den istället för att lägga delar av menyn i javascriptet.

Nått åt detta hållet kanske?
http://www.i-marco.nl/weblog/yui-accordion/#basic

[andi]

Fast jag ser inte varför du måste ha ett #submenu-element som alla submenyers innehåll ska flyttas till, om du skapar en nästlad lista så visar du det sub-element som är aktuellt. Om det handlar om att alla submenyelement ska visas på samma sätt/position kan du ju styra detta med CSS/JQuery.

[jayzee]

Ursprungligen postat av fabian

Jag får nog hålla med om att det låter betydligt smartare att ha hela menyn i html, och istället jobba med att dölja/visa olika delar av den istället för att lägga delar av menyn i javascriptet.

Nått åt detta hållet kanske?
http://www.i-marco.nl/weblog/yui-accordion/#basic

http://bit.ly/cwyQ6n

[andi]

OK, då skapar du först en lista med alla huvudmeny-element, sedan en lista med alla sub-element, när huvud-element med tex index 3 klickas så visar du submenyelement med index 3, resten gömmer du med hide().

[jayzee]

Ursprungligen postat av andi

OK, då skapar du först en lista med alla huvudmeny-element, sedan en lista med alla sub-element, när huvud-element med tex index 3 klickas så visar du submenyelement med index 3, resten gömmer du med hide().

Det är en bra idé ifall alla länkar skall öppna en undermeny, i mitt fall skall 3 av alla länkar öppna undermeny (ignorera att alla länkar nu gör det på sidan), de övriga skall öppna sidor.

[andi]

OK, men då kan du ha ett submeny-element per huvudmeny iallafall. För de huvudsidor som har en undermeny så har du ett förfarande, för de submenyer som inte har en lista utan en länk så gör du något annat.

Det är ju lätt att kolla med JQuery om ett submenyelement har en lista som första "barn" eller om det är en <a>-tag tex och göra en IF-ELSE-sats med två olika förfaranden i onclick-eventet.