Disattivare hamburger-menu ad un certo breakpoint
Author: Mario M.
Visited 235,
Followers 3,
Shared 0
Salve a tutti, volevo sapere se c'è un modo (anche con aggiunta di codice) di non far apparire l'hamburger menu ad un certo breackpoint e al suo posto diminuire le dimensioni dei pulsanti del menu originale in modo da visualizzarlo sempre per esteso..usando magari @media screen min e max width.
Qualche idea?
Posted on the
Secondo me potresti nasconderlo, e al posto del menu usare delle immagini in intestazione, cosi le posizioni come e dove vuoi, senza alcun codice....
Author
Grazie della risposta, ci avevo pensato però non riuscivo, cioè siccome nel sito ho messo la barra del menu che sporge a destra e a sinistra rispetto all'header e al contenuto, ho provato a nascondere il menu e mettere un oggetto testo solo che non riesco a farlo sporgere perchè essendo una parte del content prende le misure di tutto il resto....hai qualche consiglio?
perchè hai messo l'oggetto testo nel content della pagina... mirko ti ha suggerito di farlo nell'header...
Author
ma l'header è più stretto come il content...solo il menu sporge..posto un immagine
Author
questo succede
Author
Qualcuno ha qualche idea su come risolvere?
io la vedo sporgere solo a sx ???
allarga intanto il sito a 1200 cosi si allarga tutto compresi i menu (messi come immagini)....
Author
esatto è proprio quello il problema..che sostituendo il menu con un elemento testo, modificato per essere uguale al menu, succede quello, non riesco a far sporgere la barra da entrambi i lati...mi rimane fissa dov'è. Anche quando rimpicciolisco la finestra non si sposta insieme al resto ma rimane sempre li...sicuramente sbaglio qualcosa nel codice...al massimo sono riuscito ad averla centrata che si sposta con il resto...ma non riesco comunque a farla sporgere da entrambi i lati..
Author
Girando un pò nelle varie discussioni ho trovato quello che più o meno vorrei fare...praticamente per una certa risoluzione (utilizzando @media screen) invece della barra menu vorrei nascondere il menu (e questo sono riuscito) visualizzare una barra uguale al menu (riuscito parzialmente perchè come dicevo prima non riesco a farla sporgere) con la scritta al centro "MENU" e l'effetto di questa discussione
https://helpcenter.websitex5.com/en/post/81707
in modo che cliccando sulla scritta "MENU" vengano visualizzate le varie pagine del sito web a cui poi creerò i collegamenti...
spero di essere riuscito a spiegarmi XD
se vi servono altre info chiedetemi pure...grazie.
Author
Mirko ho visto che hai partecipato all'altra discussione...magari riesci ad aiutarmi..
Author
up
Author
AGGIORNAMENTO: ho risolto praticamente tutto, l'unica cosa che ancora mi manca è come fare sporgere sia a destra che a sinistra una barra (una riga praticamente)...se qualcuno sa come risolvere quello poi ho sistemato tutto!
Grazie
metti come sfondo Header, una immagine pronta con la riga del menu e metti ripetizione in orizzontale...in questo modo la avrai tutto schermo.....
prova questa immagine come sfondo header e metti ripetizione in orizzontale cosi ti rendi subito conto di cosa parlo....ricorda, intestazione trasparente, e menu sotto intestazione....poi le misure le regoli tu come vuoi......
Author
grazie della risposta ma non credo di aver capito...ho fatto come hai detto e ti allego l'immagine ma non mi pare sia giusta
Author
il risultato che vorrei avere è questo che ti allego...
Author
solo che al posto della barra nera che è un menu, vorrei la prima riga della pagina in modo da poter ottenere un menu a comparsa. Quello che sono riuscito a fare è questo
Author
il menù funziona solo che la barra non sporge...
Crea lo sfondo del content e dell'intestazione leggermente piú piccolo...cioe metti 10 px sia a dx che a sx di trasparente nei 2 sfondi, cosi che ad occhio sembrano piú piccoli della barra menu.... Non so se mi sono spiegato ?
Author
Ho parzialmente risolto mettendo i margini destro e sinistro del content a 0px e poi mettendo quelli delle celle in style più alti, solo che quando vado ad impostare con il codice i margini di nuovo a 0px per le altre risoluzioni non funziona...uso questo codice:
<style> @media screen and (min-width: 960px){
#imPageRow_2{margin: 0 0 0 0;}
}</style>
ma non mi sistema i margini
Author
ti posto i 2 screen il primo ok.png è quello dove sono riuscito a sistemare mentre nell'altro che sarebbe aumentando la risoluzione si vede che l'immagine non prende il comando del margine a 0px che ti ho scritto prima..
stai facendo tutto usando codici per niente....con delle immagini ad hoc faresti in un attimo senza diventare matto...
Author
grazie delle risposte, purtroppo con le immagini non riuscivo ad avere l'effetto voluto, alla fine sono riuscito comunque a completare il progetto! Grazie a tutti.
Saluti.
Author
ah e se a qualcuno servissero info sui vari codici usati chieda pure!
risultato?
penso parli di questo:
http://www.legantichimotori.it/
Author
si esatto il sito è quello che ha postato Mirko