Come abbiamo visto in numerosi tutorial, una delle pecche del CSS3 è che non viene supportato da una buona parte dei browser. Tra questi, naturalmente, è presente  Internet Explorer, un vero flagello per tutti i web designer. Dato, però, che IE rappresenta la più grossa fetta di mercato nel campo dei browser web, si ha la necessità di rendere compatibile ogni sito web anche con quest’ultimo navigatore. Un vero lavoraccio.

Oggi vi voglio proporre 5 esempi dove, tramite l’uso di CSS3, vengono ricreate animazioni ed effetti suggestivi senza l’utilizzo di altre tecnologie.

Ammetto di aver cercato in lungo ed in largo una guida che spiegasse come creare un popup, o una finestra di dialogo, in jQuery, prima di esser arrivato alla soluzione finale di smanettare da solo. In verità, ho trovato alcuni tutorial, ma la maggior parte non mi assicuravano una perfetta compatibilità con IE 7+ ed avevano alcuni problemi di CSS. Inoltre, cercavo qualcosa di davvero semplice e mi sembrava futile installare qualche libreria per jQuery solo per fare una cosa banalissima. Ma bando alle ciance, ecco una demo, molto minimale, di ciò che dovreste ottenere. Partiamo con il codice!

Abbiamo già parlato sia del jQuery che del CSS 3 in alcuni articoli precedenti, mostrandone solo alcune delle potenzialità nella creazione di un form o di un bottone; oggi, invece, ci interesseremo a creare un menu verticale dinamico e versatile.
Potete vedere una demo qui, mentre scaricare l’esempio da qui.

Nella guida di oggi, voglio mostrarvi come creare un efficace bottone in stile web 2.0 dagli angoli arrotondati, utilizzando solamente CSS3. Naturalmente sarà compatibile solo con i browser che supportano questo linguaggio, e per ora vale a dire, Safari e Firefox. Potete vedere una demo del bottone cliccando qui e scaricarlo, invece, da qui.