domingo, 15 de septiembre de 2013

[Tutorial] Menu Piano Hover

Hola! 
Hoy les traigo un Tutorial! *0* espero que les sirva.
Es un tuto de un Menu muy Kawaii:


☆ Edicion HTML
☆ Busca ]]></b:skin>  y antes de eso pega:

/* Menu Electric by Annyz Blog */
.electric {
background:#EDC1FF;
padding:4px;border-top:1px solid:#FFABD7;
border-bottom:1px solid #eee;
margin-bottom:0px;
text-shadow:1px 1px 1px #FFABD7;
font:11px verdana;color:#FF0D7A;
-webkit-transition:all .50s linear;
-moz-transition:all .2s linear;
transition:all .90s linear;
-moz-border-radius: 35px;
border-radius: 35px;
}
.electric:hover {
background:#FFF9AF;
padding:4px;border-top:1px;
padding-left:40px;
text-shadow:100px 1px 1px #FF0D7A;
font:11px verdana;color:#26B0FF;
filter: hue-rotate(190deg); -webkit-filter: hue-rotate(360deg);
-moz-filter: hue-rotate(360deg);
    -o-filter: hue-rotate(360deg);
    -ms-filter: hue-rotate(360deg);
-webkit-transition-duration: 0.20s;-webkit-border-radius: 3px;
-moz-border-radius: 35px;
border-radius: 35px;
Todo lo que lleve este simbolo  #  es el color que lo puedes editar.

☆ Diseño
☆ Añadir Gadget HTML Javascript y pegar en el este codigo:

<div class="electric"><a href="LINK DE TU ENLACE">Categoria</a></div>
<div class="electric"><a href="LINK DE TU ENLACE">Categoria</a></div>
<div class="electric"><a href="LINK DE TU ENLACE">Categoria</a></div>
<div class="electric"><a href="LINK DE TU ENLACE">Categoria</a></div>  
Eso es todo.
Espero que te haya servido, dejame un comentario si necesitas alguna ayudita. Nos vemos 

-C- 

No hay comentarios:

Publicar un comentario

Genial! Vas a dejarme un comentario?
Recuerda...
-No ulsultos
-No spam
-Puedes hacer pedidos amablemente.
-Si ves algo tuyo avisamelo de buena forma.
Eso es todo >w< gracias por dejarme un comentario, me hacen la personita mas feliz de la tierra❤
Caritas:
(。◕‿◕。)(◕_◕)(◕‿◕)\(◕ ◡ ◕\)Σ ◕ ◡ ◕(◕︵◕)(´◕ฺω◕ฺ`)(◕ฺ∀◕ฺ)✿◕‿◕✿ ❀◕‿◕❀ ❁◕‿◕❁✾◕‿◕✾ (°∀°)(• ε •)(●´ω`●)
Ծ_Ծஇ_இอ_อ อ้_อ้ ๏_๏๏̯͡๏ •▱• ↁ_ↁ ⇎_⇎≧ヮ≦ ⊙ω⊙ ⊙▂⊙ ⊙△⊙ ⊙︿⊙ ʘ‿ʘ ⊙﹏⊙ ⊙0⊙╰☆╮□_□ ◉_◉ ◉△◉ ○_○ ◔_◔ ◔ᴗ◔ ◕◡◕◪_◪ ◮_◮☆¸☆☻_☻♥◡♥句_句(゜Д゜)☜(⌒▽⌒)☞ (☞゚ヮ゚)☞ ☜(゚ヮ゚☜)^ㅂ^ ヽ(o`皿′o)ノ (≧ロ≦) (ΘεΘ;)

domingo, 15 de septiembre de 2013

[Tutorial] Menu Piano Hover

Hola! 
Hoy les traigo un Tutorial! *0* espero que les sirva.
Es un tuto de un Menu muy Kawaii:


☆ Edicion HTML
☆ Busca ]]></b:skin>  y antes de eso pega:

/* Menu Electric by Annyz Blog */
.electric {
background:#EDC1FF;
padding:4px;border-top:1px solid:#FFABD7;
border-bottom:1px solid #eee;
margin-bottom:0px;
text-shadow:1px 1px 1px #FFABD7;
font:11px verdana;color:#FF0D7A;
-webkit-transition:all .50s linear;
-moz-transition:all .2s linear;
transition:all .90s linear;
-moz-border-radius: 35px;
border-radius: 35px;
}
.electric:hover {
background:#FFF9AF;
padding:4px;border-top:1px;
padding-left:40px;
text-shadow:100px 1px 1px #FF0D7A;
font:11px verdana;color:#26B0FF;
filter: hue-rotate(190deg); -webkit-filter: hue-rotate(360deg);
-moz-filter: hue-rotate(360deg);
    -o-filter: hue-rotate(360deg);
    -ms-filter: hue-rotate(360deg);
-webkit-transition-duration: 0.20s;-webkit-border-radius: 3px;
-moz-border-radius: 35px;
border-radius: 35px;
Todo lo que lleve este simbolo  #  es el color que lo puedes editar.

☆ Diseño
☆ Añadir Gadget HTML Javascript y pegar en el este codigo:

<div class="electric"><a href="LINK DE TU ENLACE">Categoria</a></div>
<div class="electric"><a href="LINK DE TU ENLACE">Categoria</a></div>
<div class="electric"><a href="LINK DE TU ENLACE">Categoria</a></div>
<div class="electric"><a href="LINK DE TU ENLACE">Categoria</a></div>  
Eso es todo.
Espero que te haya servido, dejame un comentario si necesitas alguna ayudita. Nos vemos 

-C- 

No hay comentarios:

Genial! Vas a dejarme un comentario?
Recuerda...
-No ulsultos
-No spam
-Puedes hacer pedidos amablemente.
-Si ves algo tuyo avisamelo de buena forma.
Eso es todo >w< gracias por dejarme un comentario, me hacen la personita mas feliz de la tierra❤
Caritas:
(。◕‿◕。)(◕_◕)(◕‿◕)\(◕ ◡ ◕\)Σ ◕ ◡ ◕(◕︵◕)(´◕ฺω◕ฺ`)(◕ฺ∀◕ฺ)✿◕‿◕✿ ❀◕‿◕❀ ❁◕‿◕❁✾◕‿◕✾ (°∀°)(• ε •)(●´ω`●)
Ծ_Ծஇ_இอ_อ อ้_อ้ ๏_๏๏̯͡๏ •▱• ↁ_ↁ ⇎_⇎≧ヮ≦ ⊙ω⊙ ⊙▂⊙ ⊙△⊙ ⊙︿⊙ ʘ‿ʘ ⊙﹏⊙ ⊙0⊙╰☆╮□_□ ◉_◉ ◉△◉ ○_○ ◔_◔ ◔ᴗ◔ ◕◡◕◪_◪ ◮_◮☆¸☆☻_☻♥◡♥句_句(゜Д゜)☜(⌒▽⌒)☞ (☞゚ヮ゚)☞ ☜(゚ヮ゚☜)^ㅂ^ ヽ(o`皿′o)ノ (≧ロ≦) (ΘεΘ;)