Cerca
Filtra la ricerca ...
Frase esatta
Categorie

Come creare tooltip utilizzando solo CSS3 ed HTML5

I Tooltips sono delle piccole finestre che si aprono normalmente al passaggio del mouse su un link ipertestuale, nella compilazione di un form oppure appaiono per mostrare eventuali avvisi o errori all’interno di un sito web.

come creare tooltip con css3
Con CSS3 ed HTML5 è possibile creare dei tooltip molto carini e semplici, senza ricorrere all’utilizzo di jQuery o altre librerie Javascript.

Vediamo subito un esempio pratico.

la classe tooltip serve per la formattazione del tooltip vero e proprio, invece la proprietà CSS3 data-tool=”classico” contiene il testo del tooltip .

In questo caso avremo un effetto come nella figura sottostante

esempio tooltip Il CSS3 che regola e formatta il tooltip è il seguente

Nel file css allegato all’archivio .zip, dalla riga 215 è possibile personalizzare la colorazione dei toolips cambiando semplicemente il valore esadecimale.

Potrebbe interessarti anche ...

Lascia un commento

Questo sito usa Akismet per ridurre lo spam. Scopri come i tuoi dati vengono elaborati.