Warning: file_exists() [function.file-exists]: open_basedir restriction in effect. File(/var/lib/php/session) is not within the allowed path(s): (/home/httpd/vhosts/cssmagazine.it/httpdocs:/tmp) in /home/httpd/vhosts/cssmagazine.it/httpdocs/wp-content/plugins/wassup/lib/wassup.class.php on line 284
CSSMagazine » Mootools

Scorrimento orizzontale con CSS e Mootools

Mootools, Tutorial, XHTML/CSS 1 Commento »

Orizontal slider

Segnaliamo questo utilissimo tutorial apparso su Woork che ci mostra come realizzare un effetto di scorrimento orizzontale  al movimento del mouse. In passato effetti del genere erano realizzabili solamente in Flash, oggi la potenza del CSS e del framework Mootools ci consentono di ottenere risultati analoghi con poche righe di codice Javascript e CSS.

Per capire esattamente di cosa stiamo parlando, date un’occhiata all’esempio prodotto nel tutorial.

Gli utilizzi di una simile tecnica sono molteplici, dalla semplice presentazione orizzontale delle diverse sezioni del proprio sito alla fotogallery con scorrimento delle miniature al passaggio del mouse: l’unico limite, come sempre, è la vostra creatività.



Pannello a scomparsa con Mootools

Javascript, Mootools, Tutorial, XHTML/CSS 5 Commenti »

Pannello a scomparsa

Una tendenza molto diffusa negli ultimi tempi è quella di inserire nelle proprie pagine delle aree a scomparsa, che possono essere espanse/ridotte per visualizzare ulteriori informazioni. Questa pratica, oltre ad aggiungere (se ben realizzata) un elemento di originalità al proprio design, presenta dei vantaggi anche dal punto di vista comunicativo: permette infatti di nascondere informazioni superflue, favorendo la concentrazione del visitatore su quello che è il messaggio principale contenuto nella pagina.

L’immagine all’inizio del post rappresenta un esempio di utilizzo di questa tecnica. Toggle, web agency londinese, ha infatti utilizzato questa tecnica nel suo nuovo sito per nascondere i servizi destinati ai clienti.

Vediamo ora come realizzare un effetto simile sfruttando Mootools e una semplice funzione javascript.
Leggi tutto »