Accordion Menu - JQuery bei neuer Seite ausgeklappt bleiben

fUnKuCh3n

Erfahrenes Mitglied
Moin liebe Tutorials Gemeinde,

ich habe mir folgendes Accordion Menü runtergeladen und würde es gern so anpassen, dass wenn man auf einen Link klickt dass die jeweilige Sektion des Links ausgeklappt bleibt, auch wenn die neue Seite geladen wurde.

Das Menü findet ihr hier: http://mysash.de/mysash.de/dev/accordion-menu/

Liebe Grüße
Sascha
 
Hi,

du kannst mit Hilfe der Methode trigger einen click-Event für das erforderliche Element auslösen.
Code:
$("#firstpane p.menu_head").eq(0).trigger('click');
Damit liesse sich der erste Punkt aufklappen.

Um sich den Index über die Seite hinaus zu merken, könnte auf Cookies zugegriffen werden. Ein Pseudocode könnte wie folgt aussehen:
Code:
//  Developed by Roshan Bhattarai
//  Visit http://roshanbh.com.np for this script and more.
//  This notice MUST stay intact for legal use
// --------------------------------->
$(document).ready(function(){

  //slides the element with class "menu_body" when paragraph with class "menu_head" is clicked
  $("#firstpane p.menu_head").click(function(){
    $(this).css({backgroundImage:"url(http://mysash.de/mysash.de/dev/accordion-menu/down.png)"}).next("div.menu_body").slideToggle(300).siblings("div.menu_body").slideUp("slow");
    $(this).siblings().css({backgroundImage:"url(http://mysash.de/mysash.de/dev/accordion-menu/left.png)"});

    // ToDo:
    // Index speichern (z.B. in Cookie)
    // Pseudocode : setCookie('index', $("#firstpane p.menu_head").index(this));
  });

  //slides the element with class "menu_body" when mouse is over the paragraph
  $("#secondpane p.menu_head").mouseover(function(){
    $(this).css({backgroundImage:"url(http://mysash.de/mysash.de/dev/accordion-menu/down.png)"}).next("div.menu_body").slideDown(500).siblings("div.menu_body").slideUp("slow");
    $(this).siblings().css({backgroundImage:"url(http://mysash.de/mysash.de/dev/accordion-menu/left.png)"});
  });

  // Beispiel den ersten Punkt aufzuklappen
  $("#firstpane p.menu_head").eq(0).trigger('click');
  // Pseudocode für Cookie: $("#firstpane p.menu_head").eq(getCookie('index')).trigger('click');
});
Für die Cookie-Verwaltung könntest du ein entsprechendes jQuery-PlugIn verwenden (z.B. jquery.cookie.js).

Ciao
Quaese
 
Zurück