WebSite X5Help Center

 
Stefano L.
Stefano L.
User

Icone nelle voci di primo livello Hamburger menù  it

Autore: Stefano L.
Visite 890, Followers 3, Condiviso 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.

Postato il
19 RISPOSTE - 4 UTILI - 1 CORRETTO
Incomedia
Elisa B.
Incomedia

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.

Leggi di più
Postato il da Elisa B.
Stefano L.
Stefano L.
User
Autore

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

Leggi di più
Postato il da Stefano L.
 lemonsong  
 lemonsong  
User

Premesse:

  • ho la demo, quindi quello che scriverò potrebbe non essere valido per le versioni full
  • non conosco a fondo l'ultima versione, quindi non so se quello che chiedi si può fare da programma
  • ho scritto due CSS tanto per tenere impegnata un po' la mente e non pensare a... "quello lì", avete capito di cosa parlo; probabilmente si potrebbero semplificare, ma "quello lì" è abbastanza invadente e rompe i maroni
  • sono più lunghe le premesse che il resto del post

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 :)

Leggi di più
Postato il da  lemonsong  
Stefano L.
Stefano L.
User
Autore

Parlavo di hamburger menù e del cambio di colore del TESTO di primo livello... nel tuo esempio i testi sono tutti neri....

 lemonsong  
Premesse: ho la demo, quindi quello che scriverò potrebbe non essere valido per le versioni full non conosco a fondo l'ultima versione, quindi non so se quello che chiedi si può fare da programma ho scritto due CSS tanto per tenere impegnata un po' la mente e non pensare a... "quello lì", avete capito di cosa parlo; probabilmente si potrebbero semplificare, ma "quello lì" è abbastanza invadente e rompe i maroni sono più lunghe le premesse che il resto del post 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 :)
Leggi di più
Postato il da Stefano L.
Stefano L.
Stefano L.
User
Autore

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....

Stefano L.
Parlavo di hamburger menù e del cambio di colore del TESTO di primo livello... nel tuo esempio i testi sono tutti neri....  lemonsong   Premesse: ho la demo, quindi quello che scriverò potrebbe non essere valido per le versioni full non conosco a fondo l'ultima versione, quindi non so se quello che chiedi si può fare da programma ho scritto due CSS tanto per tenere impegnata un po' la mente e non pensare a... "quello lì", avete capito di cosa parlo; probabilmente si potrebbero semplificare, ma "quello lì" è abbastanza invadente e rompe i maroni sono più lunghe le premesse che il resto del post 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 :)
Leggi di più
Postato il da Stefano L.
 lemonsong  
 lemonsong  
User
Stefano L.
Parlavo di hamburger menù e del cambio di colore del TESTO di primo livello... nel tuo esempio i testi sono tutti neri....

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).

Stefano L.

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:

 lemonsong  
Se non ho capito, ignora tutto.

Oppure "quello lì" ha fatto danni nel poco cervello che mi è rimasto smile

Ecco quello che vedo:

.

Leggi di più
Postato il da  lemonsong  
Stefano L.
Stefano L.
User
Autore

....l'ho visualizzato su chrome..... li vedo neri veramente cool

Leggi di più
Postato il da Stefano L.
Stefano L.
Stefano L.
User
Autore

Esatto, con safari da mobile visualizzo corretto...

Sapresti guidarmi passo-passo per come fare?

Grazie

 lemonsong  
Stefano L. Parlavo di hamburger menù e del cambio di colore del TESTO di primo livello... nel tuo esempio i testi sono tutti neri.... 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). Stefano L. 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:  lemonsong  Se non ho capito, ignora tutto. Oppure "quello lì" ha fatto danni nel poco cervello che mi è rimasto Ecco quello che vedo: .
Leggi di più
Postato il da Stefano L.
Stefano L.
Stefano L.
User
Autore

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...

             

Leggi di più
Postato il da Stefano L.
 ‪ KolAsim ‪ ‪
 ‪ KolAsim ‪ ‪
Moderator

... posta il LINK delle tue prove reali online, un click ...

Leggi di più
Postato il da  ‪ KolAsim ‪ ‪
 lemonsong  
 lemonsong  
User

Aggiornato l'esempio postato ieri con l'aggiunta del selettore per la "voce livello".

Leggi di più
Postato il da  lemonsong  
Stefano L.
Stefano L.
User
Autore

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....


 ‪ KolAsim ‪ ‪
... posta il LINK delle tue prove reali online, un click ...
Leggi di più
Postato il da Stefano L.
 lemonsong  
 lemonsong  
User

*livello 1

Leggi di più
Postato il da  lemonsong  
Stefano L.
Stefano L.
User
Autore

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

 lemonsong  
Aggiornato l'esempio postato ieri con l'aggiunta del selettore per la "voce livello".
Leggi di più
Postato il da Stefano L.
 lemonsong  
 lemonsong  
User

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.

Leggi di più
Postato il da  lemonsong  
Stefano L.
Stefano L.
User
Autore

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>

---------------------------------------

 lemonsong  
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.
Leggi di più
Postato il da Stefano L.
Stefano L.
Stefano L.
User
Autore

Ok, adesso la visualizzo ma sovrapposta al testo... guarda SERVIZI+

 lemonsong  
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.
Leggi di più
Postato il da Stefano L.
 lemonsong  
 lemonsong  
User

Anche questo, da programma: se allinei il testo a sinistra, devi aumentare il margine orizzontale (esempio):

Leggi di più
Postato il da  lemonsong  
Stefano L.
Stefano L.
User
Autore

perfetto! tutto chiaro...

 lemonsong  
Anche questo, da programma: se allinei il testo a sinistra, devi aumentare il margine orizzontale (esempio):
Leggi di più
Postato il da Stefano L.