Vis aktiv toggle efter refresh

Det mest smarte ville nok være at bruge AJAX til at loade indholdet, så siden slet ikke opdaterede og menuen derfor ikke lukkede med mindre man bad den om det.

Skal det gøres på denne måde, så drop cookies - de er dybt forældede til det - og brug localStorage i stedet.

Når en menu åbnes, kan du samtidig sætte id'et på den menu i localstorage med f.eks. localStorage.setItem('openMenuId', menuId);
Når menuen lukkes manuelt, uden en anden åbnes, sletter du det med localStorage.removeItem('openMenuId');
Og hver gang en side åbnes, tjekker du så om der er en åben menu med localStorage.getItem('openMenuId') - og hvis der er det, åbner du menuen med det id med det samme.

Det er rigtig smart :o)

Men har du et eksempel på det så eg har noget at gå efter.
Er ikke lige den helt skrappe til det :o)

Kan du fortælle eller vise hvordan dine menuer er lavet? Så er det nemmere at lave et eksempel der kan bruges.

Jeg har ikke lige det store overblik over det lige nu men kan du se det igennem googles hjælpeværtøj i chrome.
Link til siden: http://testmenu.ankerstjerneweb.dk/wordpress/

Hej Slater

Jeg fandt lidt om det men kan ikke rigtig kommer frem til en sammenhæng med at toggle min menu.

function storeItem() {
            var item = $('#item').val();
            localStorage.setItem('myItem', item);
            sessionStorage.setItem('myItem', item);

            refresh();
        }

        function refresh() {
            $('#localItem').text(localStorage.getItem('myItem'));
            $('#sessionItem').text(sessionStorage.getItem('myItem'));
        }

        $(function () { refresh(); });

Er kommet frem til hvordan det hænger sammen med toggle:

.main-navigation li ul.focus>ul,.main-navigation ul li:hover>ul,.secondary-navigation ul li.focus>ul,.secondary-navigation ul li:hover>ul{
  left:0;
  display: block;
  float: left;
  display: none;
}
.main-navigation ul li a:hover, .main-navigation ul li:hover > a, a.cart-contents:hover, .site-header-cart .widget_shopping_cart a:hover, .site-header-cart:hover > li > a, .site-header ul.menu li.current-menu-item > a {
    color: #838383;
    background-color: #FFF;
}
.main-navigation ul.show{
  left:0;
  display: block;
  float: left;
}

var toggle_over =
{
    ready:function()
    {
        $('.main-navigation li ul').click(function(){
            $(this).find('.main-navigation ul li.focus>ul,.main-navigation ul li:hover>ul,.secondary-navigation ul li.focus>ul,.secondary-navigation ul li:hover>ul').toggleClass('show');
        }
    )}
}
$(document).ready(toggle_over.ready);

Men nu kommer jeg så der til hvor når jeg trykker refresher den og jeg mister min aktive toggle.

Jeg har ikke lige haft tid før nu, sorry. Men jeg beklager hvis det er mig der bare er langsom, men jeg er stadig ikke helt sikker på, jeg forstår hvad du gerne vil opnå, nu hvor jeg ser siden.
Er det den menu med "Velkommen" og "Shop", du vil have til at blive fremme ved sideskift? Det gør i så fald tingene lidt anderledes at den aktiverer ved mouseover og ikke klik. Ikke fordi det ikke kan lade sig gøre, men fordi det vil være underligt UI-design at den ikke lukker af sig selv.
- Eller er det noget andet?

Hej

Jeg oprettede lige et spørgsmål lige for et sek siden :D

Men jo det jeg forsøger på er at når jeg så toggler menuen og jeg sammentidig skal ind på den side, men hvor dens undersider også kommer frem undermenuen
Håber det giver mening

Der er en side som asos.com den er jeg ret sikker på er custom kodet.
Der kan man se at når man går inde under "MEN" kommer der en undermenu op som er fremme heletiden.
Det er lidt det jeg forsøger at komme frem til :o)

Håber det giver det bedre billede.

Ah, på dén måde. Jamen det tror jeg sådan set slet ikke er lavet som en folde-ud-menu på den måde. Det er sandsynligvis bare lavet i server-side, sådan at hvis man er på siden /men/ eller en underside, så inkluderer den en ekstra div med menuen i fra serverens side. Den menu eksisterer jo først efter siden er skiftet.

Det kan du gøre i dine Wordpress templates i PHP-kode, men det kan også lade sig gøre i Javascript og CSS.

F.eks. kan du lave menuen så den er der fast, skjule den med display: none; i CSS, og så i Javascript f.eks. skrive

if (location.href.indexOf('/shop/')) {
    $('#din-menus-id').show();
}

Rettelse, det bør være
if (location.href.indexOf('/shop/') >= 0)

Jeg glemte lige et øjeblik at ikke-fundet returnerer -1, som evaluerer til true.

Jeg har en side som jeg er ved at lave, der har jeg 2 menuer en der hedder dreng og pige, hvordan styre jeg det, så den ikke viser fra dem begge på en gang.

Står der f.eks. domæne.dk/shop/dreng/ når du er inde på dreng og ligeledes /pige/ på pigesiden? Så kan du bruge ovenstående, bare hvor du skifter "/shop/" ud med "/dreng/" osv.

Et eksempel:

<div id="menu-dreng">Menu for drenge</div>
<div id="menu-pige">Menu for piger</div>

<script>
if (location.href.indexOf('/dreng/') >= 0) {
    $('#menu-dreng').show();
}
else if (location.href.indexOf('/pige/') >= 0) {
    $('#menu-pige').show();
}
</script>

Jeg vil dog stadig sige det er bedre at gøre det i PHP, mest af hensyn til søgemaskiner, men det betyder ikke så meget.

Jeg er lige ved at prøve det af på den der test side :o)

Har lige prøvet men syntes ikke den bliver fremme, ved ikke lige helt hvad jeg gør galt jeg brugte
<li id="menu-item-56" class="menu-item menu-item-type-post_type menu-item-object-page menu-item-has-children current-menu-item current_page_item menu-item-56">

if (location.href.indexOf('/shop/') >= 0) {
    $('#menu-item-56').show();
}

Kan du se hvad jeg skal bruge?

Så er jeg kommet frem til noget der virker nogenlunde.
$(document).ready(function () {
if (location.href.indexOf('/drenge/') >= 0) {
    $('.main-navigation ul ul,.secondary-navigation ul ul').show();
}
else if (location.href.indexOf('/pige/') >= 0) {
    $('.main-navigation ul ul,.secondary-navigation ul ul').show();
}
});
Men der dukker begge undermenuer op både under drenge og pige
Er der en måde hvor jeg kan gøre det mere opdelt?

Det virker fint men ikke optimalt for når jeg så vil have flere undermenuer bliver alle vist.

Er det slet ikke muligt at toggle det og så stadig gemme toggle efter refresh.
Håber det er muligt, ellers må jeg sige, det ikke kan lade sig gøre som de gerne vil have det. :o/