Tutorial:Imagen con menu oculto 2 ♥

Hola  como estan?ya son 96 seguidores ,faltan 4 para que llegemos a los 100 seguidores   wii ¡¡¡ Bueno hoy les traigo otro tutorial como poner un menu oculto en la imagen,ase tiempo hice uno ,este es diferente ,al pasar sobre la imagen aparece el menu ,aqui una imagen de como queda:

Para verlo mejor clic en :
Vista Previa

Si les gusto sigan los pasitos siguientes :

Ir a Plantilla/Editar Html/ presionar Ctrl+F

Y ponen  ]]></b:skin>  

Al encontrarlo pegar el siguiente codigo antes de  ]]></b:skin>

#escondi:hover #menu{
opacity:1;
}
#menu{
opacity: 0;
position:absolute;
-webkit-transition: all 1s ease-in-out;-moz-transition: all 1s ease-in-out;-ms-transition: all 1s ease-in-out;transition: all 1s ease-in-out;
margin-top:-70px;
}
#menu a{
display: block;
padding-right:5px;
margin-left:15px;
padding:2px;
width:80px;text-align:right;font-family:'04b03';font-size:8px;text-transform: uppercase;color:#ff699e;background: white; border-right:5px #FD5B91 solid; margin-bottom:1px;-webkit-transition:all .3s linear;-moz-transition:all .3s linear;-ms-transition:all .3s linear;}
#menu a:hover{border-right:0px #CCC solid;padding-right:6px;}
@font-face {font-family: '04b03';url(http://static.tumblr.com/rozpbz7/j0dm2jpkp/04b_03__.ttf) format('woff');}

  

Para Personalizar cambiar de color :
#FD5B91:color del bordesito 
#ff699e:Color de la letra
Despues ponen guardar y se van a Diseño/Añadir gadget/HtmlJavascript
y ponen el siguiente codigo

<div id="escondi">
<img src="URL DE LA IMAGEN" />
<div id="menu">
<a href="Url de la pagina">home</a>
<a href="
Url de la pagina">sobre mi</a>
<a href="
Url de la pagina">tutoriales</a>
<a href="
Url de la pagina">creditos</a>
</div></div>

Bueno eso es todo , lo guardan y listo