Firebug è uno degli strumenti assolutamente indispensabili per qualsiasi creatore di pagine web. Si tratta di un’estensione di Firefox che è possibile scaricare qua: http://getfirebug.com/.
Firebug è un tool molto potente che permette di controllare, modificare e monitorare tutti gli aspetti di una pagina web, dai CSS all’HTML a JavaScript fino alle richieste di rete.
Dal nome, SelectORacle potrebbe sembrare come un prodotto per database ma invece non lo è. Si tratta di un grazioso strumento online che traduce selettori CSS validi in qualcosa che assomiglia ad un regolare inglese oppure spagnolo, tedesco o bulgaro (gli ultimi due sono al momento in cui scrivo l’articolo incompleti, l’italiano naturalmente non c’è).
Nell’articolo precedente abbiamo visto, come sia relativamente semplice creare un effetto di paginazione in stile Facebook. Adesso sfruttando quasi interamente quel codice, andremo a simulare la paginazione di Twitter.
Siti come Twitter o Facebook sempre all’avanguardia in fatto di tecnologia web utilizzano un effetto molto carino per visualizzare i propri risultati. Praticamente quello che vedremo è la nuova moda (ormai neanche più tanto nuova) riguardo alla paginazione dei risultati in ambiente web.
In rete si possono trovare numerosi tutorials sulla creazione di Tabs, molti dei quali sfruttano la potenza di jQuery, tuttavia ne voglio proporre uno veramente semplice e che soprattutto non richiede nessun plugin aggiuntivo.
Veniamo subito al dunque e diamo un’occhiata alla parte HTML della tecnica:
Semplicissima tecnica per applicare un effetto di bordo doppio (inteso come bordo di colori diversi) su un’immagine.
Per ottenere questo risultato utilizzeremo i CSS ed un po’ di fantasia 🙂
Uno dei problemi più diffusi tra i Web designer è quello di garantire uguale visualizzazione delle pagine realizzate, per tutti i browser in circolazione.
Fino a qualche anno fa Internet Explorer rappresentava la stragrande maggioranza degli utenti della rete, quindi si poteva anche non prendere in considerazione l’argomento. Attualmente la situazione è radicalmente cambiata, browser come Firefox o Chrome (il mio preferito) stanno conquistando fette di mercato sempre maggiori, rendendo il problema non più trascurabile.
Tra le nuove specifiche dei CSS troviamo un modulo molto interessante che ci permette di ottenere effetti di transazione fino ad ora realizzabili soltanto con linguaggi come javascript; si tratta dei CSS Transitions
Lo sapevate che è possibile ruotare le immagini (e gli altri elementi HTML) attraverso i CSS? Questo è possibile con il modulo Transforms incluso nella specifica del CSS3. Per la verità attraverso tale proprietà non è solo possibile ruotare un elemento ma possiamo eseguire altre manipolazioni 2D come traslare, inclinare o scalare gli elementi. Ma tornando alla rotazione, ecco la sintassi: