Se vuoi ricevere aggiornamenti........Unisciti al mio blog ricambierò con piacere

Post in evidenza

Lista Tutorial Blogger

Come inserire un Gadget  Made Gr aphyc Magic in un Widget html Come inserire il Like Box di Facebook Come creare una pagina su Blogge...

03 set 2013

Come creare un menù bottoni effetto hover

Vi presento un tutorial a cui tengo tanto, 
Sicuramente avrete già notato nei miei template personalizzati
i bottoncini nel menù orizzontale che si 
trasformano al passaggio del mouse, è un effetto molto originale ^_^
passa il mouse per vedere l effetto Hover
Per prima cosa realizziamo il primo bottoncino semplice con un qualunque 
programma di grafica e subito dopo un bottoncino che ci servirà per l effetto hover
 
i miei bottoncini hanno le stesse misure width139 e height 68
Adesso inseriamo il codice sotto nello stile del blog
vai su "Design"
Personalizza
Avanzato
Aggiungi css
Sostituisci l url dell immagine base e dell immagine hover
Applica al Blog


Adesso non ci resta che inserire i codici che trovate nel box sotto
in un gadget Html/Java


Adesso al posto di "http://url pagina" inseriamo l indirizzo della pagina
o di una determinata etichetta
ed al posto del "nome link" il nome che vogliamo assegnare
al nostro bottone
Potete utilizzare i miei bottoncini per fare delle prove
non è un opera impossibile, ci servirà solo un pò di pazienza
se avete dubbi o domande io sono qui ^_^
Buon divertimento ed al prossimo tutorial :)

4 commenti:

  1. Ciao Roxy, ma dove lo trovo l'indirizzo della pagina da inserire al posto di URL PAGINA ? ti mando la foto su fb

    RispondiElimina
    Risposte
    1. Ciao Armida, url di una pagina la trovi in alto nello schermo del tuo pc....http// ecc ecc ti metto qui il link di un immagine dimostrativa, copia ed incolla questo indirizzo nella barra di navigazione del tuo motore di ricerca http://i57.tinypic.com/5oxf6g.png

      Elimina
  2. che bello, era un pò che cercavo il tutorial per inserire il menu con questi bottoncini, grazie, con un pochino di pazienza me li preparo

    RispondiElimina
    Risposte
    1. ciao Annalisa spero che il tutorial sia chiaro e soprattutto semplice, per chiarimenti se hai problemi fammi sapere :)

      Elimina

Un tuo commento è sempre gradito:)