Menu (im)mobile

[JtothaX]

Amici del forum, salute a voi.
Vi scrivo perché non sono riuscito a trovare qualche post che mi schiarisca le idee su quanto sto realizzando. Trattasi di sito responsive. Abbastanza responsive. Chiaramente ho realizzato un secondo menu di navigazione principale per le versioni smartphone/tablet aka mobile. Nel foglio CSS formatto il menu, formatto il menu-mobile. A quest'ultimo impongo il display none e, in coda al foglio, dentro a @media screen width 768px attivo invece il display contrario.

Restringo la finestra del browser per fare qualche test. Siamo al breakpoint indicato.
Il menu sparisce, il menu mobile funziona con tanto di slideToggle realizzato con jQuery.
Se tengo il menu mobile aperto e torno ad allargare la finestra, per tornare diciamo alla versione desktop, mi succede che torna il menu principale ma quello mobile non sparisce.

Da cosa potrebbe dipendere?
Le ho provate un po' tutte, anche l'inclusione di PHP tramite jQuery ma continuo a non venirne fuori.


Grazie come sempre in anticipo a tutti
Chao

 

[JtothaX]

Tutti al mare, eh?

 

[criric]

Ciao, è difficile tirare a indovinare.
Hai un link ?

 

[JtothaX]

Yep, l'ho hostato a questo link
altervista.org/demo/

Confido in voi...

 

[criric]

potresti metterci una pezza con jquery

 $(window).resize(function() {
        if ($(window).width() > 768) {
            $("#menu-mobile").hide();
        }
    });

anche se nel css vedo che il display è settato a none

 

[JtothaX]

Esattamente. Avevo anche già provato una forzatura, diciamo così, con jQuery, ma nemmeno quella mi ha risolto la situazione. Incollo il codice qui di seguito, intanto provo con quello che mi hai dato tu, non si sa mai che quello funzioni...

jQuery(function(){
	
	$(document).ready(function(){
		
		var windowWidth = $(window).width();
		
		if (windowWidth <= 768) {
			$('#menu').hide();
		}
	
		if (windowWidth > 768) {
			$('#menu-mobile').hide();
			$('#menu').show();	
		}
		
		$('img#menu-mobile-activator').click(function(){
			$('#menu-mobile').slideToggle(200);			
		});
		
	});

});

 

[JtothaX]

Okay, ora questa me la dovete proprio spiegare, eh...
Perchè la tua funziona e la mia no? Non dicono la stessa cosa in modo diverso?
Forse il mio era un attimo più lungo...


Grazie comunque

 

[criric]

tu hai usato il metodo ready() e quindi esegui il codice solamente una volta al caricamento della pagina
io ho usato resize() che esegue il codice ogni volta che viene ridimensionata la finestra
devi provarlo sui cellulari non so se funziona

 

[JtothaX]

Argh, è vero, per quello funzionava col refresh...
Bueno, direi topic risolto