Pubblicato il 05/11/11e aggiornato il

Effetto degli occhi che si muovono seguendo il mouse.

Vado a illustrare un effetto molto carino che può essere installato sia in siti che trattano argomenti divertenti sia in blog un po' più seriosi ma che vogliono presentare ai lettori un tocco di sana dissacrazione. Si tratta di immagini di occhi stilizzati con le pupille che si muovono seguendo lo spostamento del mouse dei visitatori.

L'installazione è semplicissima visto che non occorre neppure intervenire sul modello. Si va su Layout > Aggiungi un gadget > HTML/Javascript, si incolla il codice e si salva. Successivamente si può posizionare al meglio l'elemento pagina. Se si usa ancora la vecchia Bacheca di Blogger bisogna andare su Design > Elementi pagina > Aggiungi un gadget > HTML/Javascript. Qui sotto ci sono i link che conducono a Google Documenti in cui ho pubblicato quattro pagine con i rispettivi codici per le quattro versioni dell'effetto. Come mia abitudine ho anche postato in rete delle demo di ciascun effetto.

I vari codici possono anche essere inseriti all'interno di un post o di una pagina statica incollandoli in modalità HTML.



Si deve fare una sola ma importante personalizzazione. Nelle quattro pagine dei codici sono evidenziati di rosso due parametri: per esempio nel primo codice

left: 107px; e  left: 285px;

Determinano rispettivamente la posizione dell'occhio sinistro e di quello destro fissandone la distanza dal margine sinistro della pagina. Se quindi vogliamo modificare la posizione degli occhi occorre ricordarsi che a una variazione del primo parametro deve accompagnarsi anche una modifica del secondo di pari valore. Prendendo come esempio il primo codice possiamo per esempio sostituire i due tag precedenti con  left: 117px; e left: 295px; per allontanarli di altri 10 pixel dal margine sinistro. 





4 commenti :

  1. Foertissimi questi occhi !! Bravo Ernesto :) .....ma il mio blog è già pesantino se ci metto anche gli occhi i miei fallower mi mandanoi a quel paese eheheheh!!! ...comunque ci penserò su...grazie ancora!!

    Baciotti by Pixia!!

    RispondiElimina
  2. Due domandine: ma gli occhi sono tutti così enormi?...e poi si può posizionarli in alto a destra o a sinistra?

    Grazie!! :)

    RispondiElimina
  3. Grazie mille per questo regalo che ci hai fatto!!
    Io ho preso l'ultima!!!
    Buona giornata

    RispondiElimina
  4. @Pixia61
    Gli occhi li puoi posizionare ovunque. Si potrebbero anche rimpicciolire ma bisogna mettere mano a tutte le distanze quindi non è un lavoro da poco

    @Mary47
    Contento che l'effetto ti sia piaciuto ;)

    RispondiElimina

Non inserire link cliccabili altrimenti il commento verrà eliminato. Metti la spunta a Inviami notifiche per essere avvertito via email di nuovi commenti. Se ti ho aiutato con il post o con le risposte ai commenti condividi su Facebook o su Twitter. Grazie.