vorrei capire un template[risolto]

[luca219]

salve,
guardando fra i 100 best site joomla ho visto questo sito www.mdmodel.it
sono rimasto incuriosito da alcune soluzioni presentate e vorrei capire come sono state fatte.
precisamente mi sono piaciute:
-le cornici ai moduli e i collegamenti fra loro
- il colore dei pulsanti sulla sinistra(quelli blu e neri)
- la simulazione di sfogliare la pagina in alto a sx.

qualcuno può darmi qualche info o link a qualche guida? 

grazie

[Sottolerighe]

Un consiglio che vale sempre è quello di analizzare la pagina con Firebug, l'eccellente estensione gratuita per Firefox.

Diventa abbastanza semplice scoprire che il template è costruito usando parecchie nested tables (piuttosto semplici da realizzare ma poco performanti).

I tasti usano il criterio abbastanza consolidato della definizione di uno sfondo diverso sullo stato "hover", definito nel template.css

Codice: [Seleziona]

a.mainlevel:link, a.mainlevel:visited {
display: block;
background: url(../images/menu_bg.png) no-repeat;
vertical-align: middle;
font-size: 11px;
font-weight: bold;
color: #ccc;
text-align: left;
padding-top: 5px;
padding-left: 18px;
height: 20px !important;
height: 25px;
width: 100%;
text-decoration: none;
}

a.mainlevel:hover {
background-position: 0px -25px;
text-decoration: none;
color: #ffff00;
}
e per quanto riguarda l'effetto peel (la linguetta) trovi tutte le spiegazioni in un ottimo articolo sulla home page di questo sito.

[neohiro]

Allora le cornici sono dei gif oppure png fatti con photoshop o qualche altro programma del genere e poi sistemati con i css a fare la cornice:

.BlockContent-tr, .BlockContent-tl, .BlockContent-br, .BlockContent-bl
{
   width: 14px;
   height: 14px;
   background-image: url('../images/BlockContent-s.png');
.BlockContent-tc, .BlockContent-bc
{
   left: 7px;
   right: 7px;
   height: 14px;
   background-image: url('../images/BlockContent-h.png');

qualcosa del genere.....

Il colore dei pulsanti semplice sfumatura fatta sempre con photoshop o affini ed al bottone poi è stato dato un rollover....

Per l'effetto pagina, quella è una div con inserito un movie di flash.

Ciao
Max

[neohiro]

Ah per la risposta alla terza domanda, scusami, non conoscevo l'articolo, avrei risolto con flash... ma se segui l'articolo che ti ha indicato Sottolerighe è molto più semplice e funzionale...

Grazie SottolR
Max

[luca219]

grazie mille
molto gentili