Ho un problema a cui non riesco a venire a capo. I link del header hanno un delay fastidioso che non riesco a rimuovere. Ho provato a ridurre con la proprietà transitions ma niente. Qualcuno riesce aiutarmi ? Grazie
Sito: www.brakeless.it
Ho un problema a cui non riesco a venire a capo. I link del header hanno un delay fastidioso che non riesco a rimuovere. Ho provato a ridurre con la proprietà transitions ma niente. Qualcuno riesce aiutarmi ? Grazie
Sito: www.brakeless.it
Buongiorno Crab
In realtà è sufficente rimuovere la proprietà transition se è quella che ti crea problemi. In a:hover inserisci un colore statico.
Oppure se la vuoi mantenere impostala in questo modo:
Cordialmente.cb-mm-on #cb-nav-bar .cb-main-nav > a:hover {
transition: color 0.25s ease 0s;
color:#2E9AFE;
}
Figurati Crab.
allora adesso l'effetto transition funziona correttamente.
Se non ti piace è sufficente eliminarlo dal css.
.cb-mm-on #cb-nav-bar .cb-main-nav > a:hover {
color:#2E9AFE;
}
Sto usando un tema di wordpress e ho aggiunto in custom css la riga .cb-mm-on #cb-nav-bar .cb-main-nav > a:hover {color:#2E9AFE;}
Per eliminare l'effetto transition devo modificare il file style.css o posso farlo dal menu del tema; custom css ?
Grazie ancora.
Mmmmm difficile che il tema te lo consenta ma non è detto
Prova a guardare prima nelle opzioni "Aspetto" --> "Nometema" se trovi qualcosa riguardo alle impostazioni dello stile. Se non trovi nulla ti conviene eliminarlo da "style.css" come dicevi tu (e secondo me fai anche prima).
Da "Custom css" assolutamente no perchè per sovrascrivere una classe occorerebbe utilizzare la formula "!important" che in quel campo non viene letta!
Analizzando il codice intanto vedo quest'errore:
Le stesse classi hanno due colori diversi. Se il bianco non ti interessa ti conviene intanto eliminare la seconda classe di stile..cb-mm-on #cb-nav-bar .cb-main-nav > li:hover > a {
color: #2E9AFE;
}
.cb-mm-on #cb-nav-bar .cb-main-nav > li:hover > a {
color: #FFF;
}
Se il ritardo della colorazione persiste è evidente che c'è una classe genitore che influenza il tuo div! Anche se vedo che l'hover sui due bottoni "contact" e "about" funzionano benissimo.
Infatti vorrei che l'hover si comportasse come i bottoni "contact" e "about" ho provato a eliminare anche il codice che lascio di seguito, ma non è servito.
.cb-mm-on #cb-nav-bar .cb-main-nav > li:hover .cb-mega-menu {
filter: progidXImageTransform.Microsoft.Alpha(enabled=false);
opacity: 1;
visibility: visible;
-webkit-transition: 0.15s opacity ease, 0.15s visibility ease;
-transition: 0.15s opacity ease, 0.15s visibility ease;
transition: 0.15s opacity ease, 0.15s visibility ease;
}
.cb-mm-on #cb-nav-bar .cb-main-nav > li:hover .cb-links-menu {
filter: progidXImageTransform.Microsoft.Alpha(enabled=false);
opacity: 1;
visibility: visible;
-webkit-transition: 0.15s opacity ease, 0.15s visibility ease;
-transition: 0.15s opacity ease, 0.15s visibility ease;
transition: 0.15s opacity ease, 0.15s visibility ease;
}
.cb-mm-on #cb-nav-bar .cb-main-nav > li:hover > a {
color: #fff;
}
Due sono i casi:
o c'è un'altra classe css da qualche parte che gli da l'effetto transition;
oppure l'effetto transition è dato da una jquery che dovrai trovare ed eliminare.
Cerca bene vedrai che il problema lo trovi. Hai già provato a vedere dalle opzioni del tema?