Icone nelle voci di primo livello Hamburger menù 
Autor: Stefano L.
Visited 759,
Followers 3,
Udostępniony 0
Buonagiorno,
è possibile una soluzione per queste due necessità?
1: visualizzare l'icona nelle voci di primo livello SOLO nell'hamburger menù (in questo caso utilizzato solo nelle visulizzazioni Mobili) E NON nella visualizzazione DESKTOP dove l'icona non deve essere visibile.
2: nell'hamburger menù: impostare un colore specifico del testo SOLO per le voci di primo livello e NON nei sottolivelli.
Grazie.
Posted on the
Buongiorno Stefano,
grazie per il tuo messaggio.
Inserendo un'icona per la voce del menù questa viene visualizzata sia per il menù esteso che per quello hamburger, mi dispiace.
In merito alla seconda richiesta intendi avere colori differenti per le voci di primo e di secondo livello?
Grazie! Buona giornata.
Autor
Buongiorno Elisa,
per il punto uno sei stata molto chiara e mi hai tolto il dubbio...
Riguardo il punto due, intendo proprio quello: vorrei avere un colore per le voci di primo livello differente da quello per le voci di secondo livello, ovviamente stiamo parlando del testo. L'unica cosa è che questa differenza la vorrei impostare solo nell'hamburger menù.
Esiste una soluzione?
Grazie
Premesse:
Se ho capito quello che vuoi fare, dai un'occhiata a QUESTO esempio. Se non trovi altre soluzioni, i due CSS li trovi nel sorgente pagina.
Un'alternativa (sempre coi CSS) è quella di usare media query, semplificando i selettori dei CSS dell'esempio.
Se non ho capito, ignora tutto.
In bocca al lupo a tutti voi e fate come i ricci: andate in letargo e quando vi sveglierete, tornateci :)
Autor
Parlavo di hamburger menù e del cambio di colore del TESTO di primo livello... nel tuo esempio i testi sono tutti neri....
Autor
intendo dire che nel tuo esempio, vorrei tutti i testi del primo livello ROSSI e quelli dei secondi livelli espansi di colore VERDI.... non sul passaggio del mouse o quando il livello attivo ma a menù "a riposo", senza effettuare azioni (a parte quando viene espanso il livello e si dovrebbe viasulizzare il testo VERDE....
Veramente sono rossi, di nero non c'è niente, ma evidentemente c'è un equivoco su qualche termine oppure stai usando un browser che non ho (in questo caso fammi sapere cosa usi).
intendo dire che nel tuo esempio, vorrei tutti i testi del primo livello ROSSI e quelli dei secondi livelli espansi di colore VERDI.... non sul passaggio del mouse o quando il livello attivo ma a menù "a riposo", senza effettuare azioni (a parte quando viene espanso il livello e si dovrebbe viasulizzare il testo VERDE....
Tutto questo lo fai da programma, a parte differenziare il colore delle voci di primo livello (secondo CSS). Se leggi il CSS dovresti capire che ho lasciato la possibilità di impostare da programma la voce su passaggio del mouse e la voce attiva.
Comunque:
Oppure "quello lì" ha fatto danni nel poco cervello che mi è rimasto
Ecco quello che vedo:
.
Autor
....l'ho visualizzato su chrome..... li vedo neri veramente
Autor
Esatto, con safari da mobile visualizzo corretto...
Sapresti guidarmi passo-passo per come fare?
Grazie
Autor
Ciao, ho incollato questo codice dopo l'apertura del tag head:
<style>
/* nascondere icona menu (desktop) */
ul.menu-mobile-animated.hidden li img {
display:none;
}
/* colore voci menu primo livello (hamburger) */
ul.menu-mobile-animated:not(.hidden) > li:not(.imMnMnCurrent):not(:hover) > div a.label {
color:red !important;
}
</style>
ottengo questo risultato, l'unica cosa è che anche i menù delle cartelle SERVIZI+, CARROZZERIA, OFFICINA, CURA DELL'AUTO, OPINIONI & SOCIAL dovrebbere essere rosse...
... posta il LINK delle tue prove reali online, un click ...
Aggiornato l'esempio postato ieri con l'aggiunta del selettore per la "voce livello".
Autor
Buongiorno KolAsim, purtroppo non posso ancora pubblicare la versione responsive...
ho postato sopra il risultato dell'anteprima... vorrei far risultare di colore rosso anche le cartelle che fanno da primo livello....
*livello 1
Autor
Grazie lemonsong... fatto e funziona...
Mi daresti il codice per inserire solo a queste voci in rosso un icona?
postami il codice riguardante solo la "index.html" e poi dimmi in che posizione lo devo incollare, se non chiedo troppo....
Grazie mille per ora
Forse ho capito male, ma le icone le inserisci da programma. La prima regola CSS le nasconde dal menu desktop.
Se non ho capito, spiegati meglio.
Autor
ok, l'avevo omessa per sbaglio....
adesso ho assegnato l'icona del menù ai primi livelli e con questo codice effettivamente dalla versione desktop le nasconde, ma nell'amburger menù non compaiono...
---------------------------------------
<style>
/* nascondere icona menu (desktop) */ul.menu-mobile-animated.hidden li img { display:none;}
/* colore voci menu primo livello (hamburger) */ul.menu-mobile-animated:not(.hidden) > li:not(.imMnMnCurrent):not(:hover) > div a.label, ul.menu-mobile-animated:not(.hidden) > li.imLevel:not(.imMnMnCurrent):not(:hover) span { color:red !important;
}
</style>
---------------------------------------
Autor
Ok, adesso la visualizzo ma sovrapposta al testo... guarda SERVIZI+
Anche questo, da programma: se allinei il testo a sinistra, devi aumentare il margine orizzontale (esempio):
Autor
perfetto! tutto chiaro...