Joomla.it Forum
Joomla! 3 => Joomla! 3 => : upload 22 Oct 2016, 20:12:01
-
Scusate ho un problema nella personalizzazione del menu seguendo le guide ho fatto alcune piccole modifiche ma non riesco a cambiare le classi hover, focus e current nel menu.
e nel sub menu non riesco nemmeno a cambiare il background figuriamoci hover, focus e current :-\
galleggio su tentativi.... allego css e screenshot
.moduletable_min {
-webkit-box-shadow: 2px 2px 8px #000;
-moz-box-shadow: 2px 2px 8px #000;
box-shadow: 2px 2px 8px #000;
background: #800000;
padding:padding: 18px 25px 21px 25px;
margin-bottom: 20px;
}
.moduletable_min h3 {
color: #FBE689;
}
.moduletable_min a {
color: #FFF;
}
.moduletable_min li {
line-height: 25px;
}
.moduletable_min active, a, hover, focus {
color: #B36666;
}
#aside .moduletable_min .nav .nav-child {
border-left: none;
padding-left: 15px;
}
-
non devi andare per tentativi, se non usi firebug ti occorre il mago otelma!
-
Ciao,
usa Firebug, se hai bisogno di una mano metti un link al sito e scrivi come li vorresti cambiare...
-
come dicevo devo solo aggiungere la classe hover per tutti i tabs di primo e secondo livello assegnando un colore e cambiare colore in background alle sotto voci del menu.
in allegato il sottomenu si vede bene ora č bianco e blu
-
Capisco. Ma se non metti un link non credo che nessuno sia in grado di aiutarti.
-
purtroppo il link non esiste perchč il sito gira in locale su una rete interna.
Comunque dovrebbe essere sufficiente aggiungere delle classi nel css personalizzato che ho postato su, io vado ancora con prove varie ma non riesco a scrivere il css giusto :o non č ancora la mia lingua...
-
Dimenticavo di dire che il template č Protostar anzi dimenticavo anche di ringraziarti adottauncane perchč hai scritto una buona guida che ho seguito passo passo
-
Purtroppo la guida č vecchiotta e in parte non pių valida... :(
Non mi sembra che le parti che hai individuato siano quelle giuste.
Ti metto qui le modifiche che ho fatto su un menų Protostar di un sito che sto cambiando per scrivere una nuova guida.
Sono una traccia, alcune parti non le vedrai (ad esempio i font) perché importati da Google font...
Fai un file user.css, basta che lo metti nella cartella css, č giā richiamato dal index.php, incollacelo dentro e cambialo come ti serve...
/*Menų*/
.nav-list > .active > a, .nav-list > .active > a:hover, .dropdown-menu li > a:hover, .dropdown-menu .active > a, .dropdown-menu .active > a:hover, .nav-pills > .active > a, .nav-pills > .active > a:hover {
background: rgba(0, 0, 0, 0) none repeat scroll 0 0 !important;
color: #666;
font-family: Satisfy !important;
font-size: 25px;
}
.navigation {
border-bottom: 0 none;
border-top: 0 none;
border-left: 2px dotted #399097;
padding:0;
margin-bottom:20px;
}
.nav-pills > li > a {
-moz-border-radius: 0px;
-webkit-border-radius: 0px;
border-radius: 0px;
margin-bottom: 0px;
margin-top: 0px;
padding-bottom: 15px;
padding-top: 15px;
font-family: Satisfy;
font-size: 25px;
border-right: 2px dotted;
}
.nav > li > a:hover,
.nav > li > a:focus {
text-decoration: none;
background: rgba(0, 0, 0, 0) none repeat scroll 0 0 !important;
}
.navbar .btn-navbar {
background-color: #087e85;
background-image: linear-gradient(to bottom, #087e85, #004466);
border-color: #087e85;
}
.navbar .btn-navbar:hover,
.navbar .btn-navbar:focus,
.navbar .btn-navbar:active,
.navbar .btn-navbar.active,
.navbar .btn-navbar.disabled,
.navbar .btn-navbar[disabled] {
color: #fff;
background-color: #087e85;
*background-color: #004466;
}
/*Sottomenų*/
.navigation .nav-child {
background-color: #F6EBD4;
border: 0;
-moz-border-radius: 0px;
-webkit-border-radius: 0px;
border-radius: 0px;
box-shadow: 0 0 10px #555;
-moz-box-shadow: 0 0 10px #555;
-webkit-box-shadow: 0 0 10px #555;
}
.navigation .nav-child a {
color: #399097;
font-family: Satisfy;
font-size: 20px;
}
.navigation .nav-child li > a:hover,
.navigation .nav-child li > a:focus,
.navigation .nav-child:hover > a {
text-decoration: none;
color: #666;
background-color: transparent;
background-color: transparent;
background-image: -moz-linear-gradient(top,transparent,transparent);
background-image: -webkit-gradient(linear,0 0,0 100%,from(transparent),to(transparent));
background-image: -webkit-linear-gradient(top,transparent,transparent);
background-image: -o-linear-gradient(top,transparent,transparent);
background-image: linear-gradient(to bottom,transparent,transparent);
background-repeat: repeat-x;
filter: progid:DXImageTransform.Microsoft.gradient(startColorstr='transparent', endColorstr='transparent', GradientType=0);
}
/*Toglie freccia*/
.navigation .nav > li > .nav-child::before {
display: none;
}
.navigation .nav > li > .nav-child::after {
display: none;
}
-
Funziona davvero bene!
Grazie e bello anche il sito con la grafica anni '50!
L'unica cosa che non mi viene ancora č impostare un margin: auto; per centrare il menu nel layout fluido.
grazie di nuovo per il codice
-
.navigation {
margin-left: auto;
margin-right: auto;
display:table;
}
-
Metti poi [RISOLTO] davanti al titolo del primo post.
-
Metti poi [RISOLTO] davanti al titolo del primo post.
se lo fa non ci credo nemmeno se lo vedo!!
-
giusebos un attimo di pazienza sto testando questa soluzione per vedere come va!
-
Non mi riesce di mettere risolto nel primo post