Codice dei pulsanti con effetto


Risolto Codice dei pulsanti con effetto

Messaggio Da Primahs il Ven 20 Lug 2012 - 22:32

Innanzitutto cosa sono? (Fuori argomento)
E dove metto questo codice?

Javascript o Html? GRAZIE

Ps: Scusate se compaiono i link Sad


Ultima modifica di Primahs il Sab 21 Lug 2012 - 20:41, modificato 1 volta
avatar
Primahs
****

Sesso : Maschile
Età : 18
Messaggi : 256
Località : Monza


Vedere il profilo dell'utente http://creepypasta.forumattivo.it/forum
Primahs è stato ringraziato dall'autore di questo topic.

Risolto Re: Codice dei pulsanti con effetto

Messaggio Da TheZanzo il Sab 21 Lug 2012 - 9:39

Se ho capito bene parli di quei pulsanti che cambiano colore al passaggio del mouse. Basta che inserisci questo nel CSS e cambi le immagini a seconda di quelle che vuoi:

Codice:
#i_icon_mini_index {
background-image: url('http://i32.servimg.com/u/f32/15/52/75/08/forum13.png');
width: 68px;
height: 27px;
}
#i_icon_mini_index:hover {
background-image: url('http://i32.servimg.com/u/f32/15/52/75/08/forumh12.png');
width: 68px;
height: 27px;
}
#i_icon_mini_new_message {
background-image: url('http://i32.servimg.com/u/f32/15/52/75/08/6110.png');
width: 68px;
height: 27px;
}
#i_icon_mini_new_message:hover {
background-image: url('http://i32.servimg.com/u/f32/15/52/75/08/5110.png');
width: 68px;
height: 27px;
}
#i_icon_mini_login {
background-image: url('http://i32.servimg.com/u/f32/15/52/75/08/3lo12.png');
width: 68px;
height: 27px;
}
#i_icon_mini_login:hover {
background-image: url('http://i32.servimg.com/u/f32/15/52/75/08/3l10.png');
width: 68px;
height: 27px;
}
#i_icon_mini_register {
background-image: url('http://i32.servimg.com/u/f32/15/52/75/08/reg210.png');
width: 71px;
height: 27px;
}
#i_icon_mini_register:hover {
background-image: url('http://i32.servimg.com/u/f32/15/52/75/08/reh10.png');
width: 71px;
height: 27px;
}
#i_icon_mini_logout {
background-image: url('http://i32.servimg.com/u/f32/15/52/75/08/2lo10.png');
width: 68px;
height: 27px;
}
#i_icon_mini_logout:hover {
background-image: url('http://i32.servimg.com/u/f32/15/52/75/08/2l10.png');
width: 68px;
height: 27px;
}
#i_icon_mini_portal {
background-image: url('http://i32.servimg.com/u/f32/15/52/75/08/portal11.png');
width: 68px;
height: 27px;
}
#i_icon_mini_portal:hover {
background-image: url('http://i32.servimg.com/u/f32/15/52/75/08/portal10.png');
width: 68px;
height: 27px;
}
#i_icon_mini_gallery {
background-image: url('http://i32.servimg.com/u/f32/15/52/75/08/gal10.png');
width: 68px;
height: 27px;
}
#i_icon_mini_gallery:hover {
background-image: url('http://i32.servimg.com/u/f32/15/52/75/08/galler10.png');
width: 68px;
height: 27px;
}

#i_icon_mini_profile {
background-image: url('http://i32.servimg.com/u/f32/15/52/75/08/profil11.png');
width: 68px;
height: 27px;
}
#i_icon_mini_profile:hover {
background-image: url('http://i32.servimg.com/u/f32/15/52/75/08/profil10.png');
width: 68px;
height: 27px;
}
#i_icon_mini_message {
background-image: url('http://i32.servimg.com/u/f32/15/52/75/08/4210.png');
width: 51px;
height: 27px;
}
#i_icon_mini_message:hover {
background-image: url('http://i32.servimg.com/u/f32/15/52/75/08/4pm10.png');
width: 51px;
height: 27px;
}
#i_icon_mini_members {
background-image: url('http://i32.servimg.com/u/f32/15/52/75/08/810.png');
width: 71px;
height: 27px;
}
#i_icon_mini_members:hover {
background-image: url('http://i32.servimg.com/u/f32/15/52/75/08/710.png');
width: 71px;
height: 27px;
}
#i_icon_mini_search {
background-image: url('http://i32.servimg.com/u/f32/15/52/75/08/search13.png');
width: 68px;
height: 27px;
}
#i_icon_mini_search:hover {
background-image: url('http://i32.servimg.com/u/f32/15/52/75/08/search12.png');
width: 68px;
height: 27px;
}
#i_icon_mini_groups {
background-image: url('http://i32.servimg.com/u/f32/15/52/75/08/1gr10.png');
width: 68px;
height: 27px;
}
#i_icon_mini_groups:hover {
background-image: url('http://i32.servimg.com/u/f32/15/52/75/08/1grou10.png');
width: 68px;
height: 27px;
}
#i_icon_mini_portal {
background-image: url('http://i32.servimg.com/u/f32/15/52/75/08/portal11.png');
width: 68px;
height: 27px;
}
#i_icon_mini_portal:hover {
background-image: url('http://i32.servimg.com/u/f32/15/52/75/08/portal10.png');
width: 68px;
height: 27px;
}

Saluti :good:
avatar
TheZanzo
**
**

Sesso : Maschile
Età : 19
Messaggi : 65
Località : Rimini


Vedere il profilo dell'utente http://geekforge.forumattivo.com
TheZanzo è stato ringraziato dall'autore di questo topic.

Risolto Re: Codice dei pulsanti con effetto

Messaggio Da Martino il Sab 21 Lug 2012 - 10:53

Ciao Primahs, potresti fare così Very Happy :
Inserisci questo codice:
Codice:
<div id="bottone"><a href="LINK INDIRIZZO" target="_blank"><img src="LINK IMMAGINE"/></a></div>

E poi nel CSS inserisci questo codice:


Codice:
.bottone {
opacity:0.5;
transition-duration:0.5s;
-moz-transition-duration:0.5s;
-webkit-transition-duration:0.5s;
-o-transition-duration:0.5s;
  }

.bottone:hover {
  opacity:1.9;
  }

Spero di esserti stato utile Wink.

Saluti, MartinoPio ciao!


Staff - Moderatore
avatar
Martino
Moderattivo
Moderattivo

Sesso : Maschile
Età : 18
Messaggi : 4167
Località : Italia


Vedere il profilo dell'utente http://wikiinfo.forumattivo.it/
Martino è stato ringraziato dall'autore di questo topic.

Risolto Re: Codice dei pulsanti con effetto

Messaggio Da Dozy™ il Sab 21 Lug 2012 - 17:42

Non cambiano colore, http://aiuto.forumattivo.it/t14618-pulsanti-con-effetto#100016 Naturalmente ci sono anche i css per fare queste cose.
avatar
Dozy™
Veterano dello staff

Sesso : Maschile
Età : 29
Messaggi : 2297
Località : Tradate (va)


Vedere il profilo dell'utente
Dozy™ è stato ringraziato dall'autore di questo topic.

Risolto Re: Codice dei pulsanti con effetto

Messaggio Da TheZanzo il Sab 21 Lug 2012 - 17:47

Lo so, non intendevo questo, parlavo di quei pulsanti su cui quando passi sopra col mouse si sfocano o si ingrandiscono
avatar
TheZanzo
**
**

Sesso : Maschile
Età : 19
Messaggi : 65
Località : Rimini


Vedere il profilo dell'utente http://geekforge.forumattivo.com
TheZanzo è stato ringraziato dall'autore di questo topic.

Risolto Re: Codice dei pulsanti con effetto

Messaggio Da Dozy™ il Sab 21 Lug 2012 - 17:55

Allora il css e html di MartinoPio va bene
avatar
Dozy™
Veterano dello staff

Sesso : Maschile
Età : 29
Messaggi : 2297
Località : Tradate (va)


Vedere il profilo dell'utente
Dozy™ è stato ringraziato dall'autore di questo topic.

Risolto Re: Codice dei pulsanti con effetto

Messaggio Da Primahs il Sab 21 Lug 2012 - 20:41

Grazie :)
avatar
Primahs
****

Sesso : Maschile
Età : 18
Messaggi : 256
Località : Monza


Vedere il profilo dell'utente http://creepypasta.forumattivo.it/forum
Primahs è stato ringraziato dall'autore di questo topic.

Vedere l'argomento precedente Vedere l'argomento seguente Tornare in alto

- Argomenti simili

 
Permessi di questa sezione del forum:
Non puoi rispondere agli argomenti in questo forum