Autore Topic: Gantry 5 - hovering del mouse  (Letto 711 volte)

Offline enzoman

  • Esploratore
  • **
  • Post: 130
    • Mostra profilo
Gantry 5 - hovering del mouse
« il: 20 Giu 2017, 00:06:44 »
Ciao a tutti,
come posso fare a far cambiare il colore della voce di menu attraverso l'hover del mouse con Gantry 5? In pratica passare il mouse sopra una voce di menu ed evidenziare quella voce senza cliccarci.

Grazie,

Enzo

Offline enzoman

  • Esploratore
  • **
  • Post: 130
    • Mostra profilo
Re:Gantry 5 - hovering del mouse
« Risposta #1 il: 20 Giu 2017, 20:25:50 »
Navigando su web, sembra che il css per l'hovering sia:
a:hover {
     background-color
: yellow;}

Siccome ho il menu posizionato sul modulo aside, ho pensato di copiare, senza successo, questo codice nel rigo Tag attribute nella seguente forma:
a sinistra style e sulla destra: a:hover{background-color: red;}

Qualche suggerimento sul come si potrebbe adattare il codice all'interno del rigo Tag attributes?

Offline xplosion

  • Global Moderator
  • Instancabile
  • ********
  • Post: 3718
  • Sesso: Maschio
    • Mostra profilo
    • Documentazione Gantry Framework
Re:Gantry 5 - hovering del mouse
« Risposta #2 il: 20 Giu 2017, 21:28:07 »
un link puoi fornire?

Offline enzoman

  • Esploratore
  • **
  • Post: 130
    • Mostra profilo
Re:Gantry 5 - hovering del mouse
« Risposta #3 il: 21 Giu 2017, 00:29:17 »
Ciao,
relativamente al link del sito, non posso perchè sto lavorando da locale; relativamente al link in cui ho trovato il codice che ho digitato prima: https://www.w3schools.com/cssref/sel_hover.asp

Offline xplosion

  • Global Moderator
  • Instancabile
  • ********
  • Post: 3718
  • Sesso: Maschio
    • Mostra profilo
    • Documentazione Gantry Framework
Re:Gantry 5 - hovering del mouse
« Risposta #4 il: 21 Giu 2017, 19:35:01 »
No, purtroppo non mi serve link della guida css, che di css diciamo che ci capisco un pò...
Il link al sito chiedevo per analizzarlo e fornirti un aiuto mirato.
Cerca di utilizzare i strumenti di sviluppo del tuo browser per trovare il codice generato.
Schiaccia F12

Offline enzoman

  • Esploratore
  • **
  • Post: 130
    • Mostra profilo
Re:Gantry 5 - hovering del mouse
« Risposta #5 il: 22 Giu 2017, 00:34:02 »
Ciao, grazie. Ho premuto F12 e nella scheda Analisi pagina ho individuato il codice relativo al modulo in cui si trova il menu in cui vorrei l'hovering. Quasi tutte le righe di codice interessate sembrano cominciare con div class; alcune di queste righe contengono il codice che ho inserito in Tag attributes. Devo cercare qualcosa in particolare?

Offline enzoman

  • Esploratore
  • **
  • Post: 130
    • Mostra profilo
Re:Gantry 5 - hovering del mouse
« Risposta #6 il: 23 Giu 2017, 11:36:46 »
Ciao a tutti,
ho seguito un tutorial su Gantry e al minuto 22.38 del link: https://www.youtube.com/watch?v=aEIt5U72T0k appare in un rigo il codice:

a:hover {color: #000;}

L'ho inserito in Tag attributes, ma non funziona (io ho usato background-color anzichè color) ... qualche suggerimento?

Offline xplosion

  • Global Moderator
  • Instancabile
  • ********
  • Post: 3718
  • Sesso: Maschio
    • Mostra profilo
    • Documentazione Gantry Framework
Re:Gantry 5 - hovering del mouse
« Risposta #7 il: 23 Giu 2017, 14:02:41 »
Guarda, non è che puoi risolvere a tentativi, visto che non sai qual'è la differenza tra color e background-color , io ti sugerisco di studiare un po delle guide css per capire l'argomento e poi approfondisci lo strumento di sviluppo del browser oppure firebug.

Offline enzoman

  • Esploratore
  • **
  • Post: 130
    • Mostra profilo
Re:Gantry 5 - hovering del mouse
« Risposta #8 il: 23 Giu 2017, 16:04:38 »
Scusami, ma da cosa deduci che non so la differenza tra background-color e color? Inoltre se ho scelto di sostituire background-color con color è soltanto perchè ho letto una guida (o comunque il link che hai postato in precedenza) in cui il codice dovrebbe essere quello (almeno per quella guida).
Infine non di minore importanza, anche se scrivo color: #000 (mi riferisco al semplice colore del testo, senza inserirlo nell'ambito dell'hover), l'unica cosa a cambiare è il colore del titolo del modulo, mentre i links (voci di menu) restano dello stesso colore (che è possibile definire dalla sezione Style)... sembra che le impostazioni definite nella sezione style abbiano la priorità su quelle personalizzate.

L'unico motivo per cui ho scelto di usare Gantry è perchè in passato avevo usato la versione 4 ed ero soddisfatto, ma per chi non conosce i css, sconsiglio assolutamente di usare la versione 5. Per quanto mi riguarda, probabilmente in fututuro non lo userò, ma al momento per il punto in cui sono arrivato preferisco non tornare indietro e completare il lavoro con Gantry.
Quindi scusami in anticipo se tornerò a fare domande stupide per chi conosce i css.
Comunque grazie per la risposta.

Offline xplosion

  • Global Moderator
  • Instancabile
  • ********
  • Post: 3718
  • Sesso: Maschio
    • Mostra profilo
    • Documentazione Gantry Framework
Re:Gantry 5 - hovering del mouse
« Risposta #9 il: 23 Giu 2017, 17:59:56 »
Scusami, ma da cosa deduci che non so la differenza tra background-color e color?
Basta questa affermazione:
Citazione
io ho usato background-color anzichè color ... qualche suggerimento?
Il discorso sulle conoscenze di CSS non ha nulla a che fare con Gantry. Si può fare sempicemente lo stesso paragone tra T3, Warp, Helix o qualsiasi altro framework e CSS.
Per l'utilizzo base di uno di questi framework, non servono conoscenze di css.
Servono invece quando vuoi personalizzare qualcosa che il pannello di administrazione non ti fornisce.
Ti ripeto, se il tuo sito non è online, difficile fornirti una soluzione mirata.
Ciao,

Online tomtomeight

  • Global Moderator
  • Fuori controllo
  • ********
  • Post: 27939
  • Sesso: Maschio
  • Gli automatismi aiutano ma non insegnano nulla.
    • Mostra profilo
    • Xataface Italia
Re:Gantry 5 - hovering del mouse
« Risposta #10 il: 23 Giu 2017, 18:32:49 »
Secondo me stai modificando la posizione non il menù.
NEWS DataGrill Xataface Installer (Ver. 1.0.1) per Joomla 3.8.x - DEMO Gestione Magazzino

Offline enzoman

  • Esploratore
  • **
  • Post: 130
    • Mostra profilo
Re:Gantry 5 - hovering del mouse
« Risposta #11 il: 23 Giu 2017, 19:45:19 »
xplosion hai ragione, rileggendo ho scritto veramente male il senso di ciò che volevo dire. In quel messaggio volevo specificare che stavo cercando di fare il mouseover dello sfondo e non del colore del carattere perchè questo è già tra le funzioni base. Volevo chiedere dei suggerimenti sulle possibili soluzioni con cui potrebbe essere scritto il codice per il mouseover.

Posso sbagliarmi, ma mi sembra di ricordare che con la versione 4 forse non sono intervenuto con la modifica del codice per l'hovering sullo sfondo.

Tomtomeight è possibile che abbia ragione perchè sto agendo dalla sezione Layout, non Menu e poi perchè stranamente modifica soltanto il colore del titolo del modulo e non le voci di menu. In questi giorni prendendo spunto da w3school ho provato a modificare il colore dei bordi, a toglierli, variarne lo stile da solid a ridge o double, ma non ho avuto nessun successo. Quindi ne deduco che ho scritto male il codice o lo sto inserendo nel posto sbagliato.
Le uniche cose che sono riuscito a modificare con il codice sono lo stile del carattere, il tipo, la dimensione e lo sfondo generale del menu, ma non il bordo tra una voce e l'altra e neanche il colore del carattere (il colore del carattere riesco a modificarlo soltanto attraverso il tab Style).

Online tomtomeight

  • Global Moderator
  • Fuori controllo
  • ********
  • Post: 27939
  • Sesso: Maschio
  • Gli automatismi aiutano ma non insegnano nulla.
    • Mostra profilo
    • Xataface Italia
Re:Gantry 5 - hovering del mouse
« Risposta #12 il: 23 Giu 2017, 20:08:43 »
Usa firebug e le istruzioni mettile nel custom.scss. Leggi poi la documentazione su come inserire il custom.scss e le modalità di acquisizione delle nuove istruzioni che inserirai in questi.
NEWS DataGrill Xataface Installer (Ver. 1.0.1) per Joomla 3.8.x - DEMO Gestione Magazzino

 

Torna su