Joomla.it Forum
Joomla! 1.5.x (versione con supporto terminato) => Joomla! 1.5 => I Template di Joomla 1.5.x => : pisolino1976 03 Oct 2009, 11:18:23
-
Premetto che non ci capisco nulla di CSS e roba simile.
Ho installato l'estensione "Bookmark System Management" che mi inserisce le icone per il social bookmarking. http://www.banitech.com/extensions/components/13-component/28-bookmark-system-manager (http://www.banitech.com/extensions/components/13-component/28-bookmark-system-manager) Trattasi peraltro di un MOD dell'estensione LINKR.
Come vedete nella pagina linkata, le icone non hanno alcun effetto in caso ci si sposta sopra il mouse (eccetto un toltip... credo che si chiami così).
Io vorrei che quando il mouse va sopra un'icona, questa si evidenzia con un bordo o con altro effetto come si può vedere in qui, alla fine paginahttp://j.l33p.com/linkr/28-bookmark-links (http://j.l33p.com/linkr/28-bookmark-links) o qui alla fine pagina http://joomladigger.com/joomla-extensions/plugins/the-ultimate-social-bookmarking-plugin.html (http://joomladigger.com/joomla-extensions/plugins/the-ultimate-social-bookmarking-plugin.html)
L'estensione che ho installato ha un file chiamato "classic.css" che consente di fare modifiche all'aspetto grafico.
Ho peraltro trovato il seguente listato che viene utilizzato nell'estensione LINKR:
div.linkr-bm {
margin:20px 30px 5px 30px;
}
div.linkr-bm div.linkr-bm-pre,
div.linkr-bm div.linkr-bm-post {
float:right;
font-size:14px;
letter-spacing:2px;
}
div.linkr-bm div.linkr-bm-sep {float:right;}
div.linkr-bm div.linkr-bm-b {
float:right;
padding:4px;
border:1px solid transparent;
}
div.linkr-bm div.linkr-bm-b img {
margin:0;
}
div.linkr-bm div.linkr-bm-b:hover {
border-color:#aaa;
background-color:#ddd;
}
div.linkr-bm-after {clear:both;}
Faccio notare quindi che il file classic.css sembra utilizza la medesima sintassi del componente LINKR iniziando per:
div.bsmmanager-bm {
}
La mia domanda quindi è: posso creare gli effetti di evidenziazione dell'icona modificando solo il file "classic.css"? ...ossia senza modificare PHP e roba simili?
-
Questa regola:
div.linkr-bm div.linkr-bm-b:hover {
border-color:#aaa;
background-color:#ddd;
}da in realtà delle disposizioni:
colora il bordo e crea uno sfondo grigio al passaggio del mouse. Il problema è che lo sfondo non si vede perchè si tratta di immagini, che in qualche altro posto gli è stato detto di non mostrare il bordo ;D
Proviamo allora mettercelo il bordino.
Cambiala così:
div.linkr-bm div.linkr-bm-b:hover {
border:1px solid #FF0000;
background-color:#ddd;
}Dovrebbe comparire un bordino rosso al passaggio del mouse ;)
-
Ti ringrazio infinitamente per il suggerimento, ma putroppo non va.
Ho scoperto che diversamente dall'estensione LINKR che ha le icone che hanno proprietà grafiche individuali, in Bookmark System Management le icone stanno dentro un area rettangolare: se inserisco i tuoi suggerimenti, si evidenzia il l'area rettangolare e non la singola icona.
-
Allora prova così:
div.linkr-bm img a:hover {
border:1px solid #FF0000;
background-color:#ddd;
}Senza un link è difficile imbroccarla alla prima prova! ;)