Welcome

- I'am Kasumi creadora de este pequeño blog.

- Me gusta la cultura japonesa,y amo mucho mucho leer. ( ˘ ³˘)♥
Si quieres tomar un pixel solo da click en la imagen y listo!, tengo el mouse inhabilitado gracias :3 (≧Д≦)

| | stalking




Tagboard


Tumblr
TUMBLR 18+

Visita

Blogger's México

Credits
Layout by yehetsandy.
Icons by Kasumi.
Sozai by Kawaii-Box.

Menu Bubblebar
Hola hoy les traigo mi primer tutorial HTML Wahoooo 
Bien este es de ese menú muy bonito en forma de burbuja y es muy facil de incoporar 


Para esto nos vamos a Diseño - Plantilla si tienen plantilla de blogskins es el mismo codigo
Y alli buscamos (ctrl + F) La Etiqueta:

</style>

ARRIBA De Ello Colocamos Lo Siguiente :

#bubblebar {font-family:lucida console; width:60px; position:fixed; right:15px; bottom:70px; z-index:999; font-size:9px; text-align:center;} .bubble {text-align:center; color:#555; float:right; height:10px; width:34px; padding-top:12px; padding-bottom:12px; margin-top:10px; overflow:hidden; -moz-border-radius: 17px 17px 17px 17px; border-radius:17px 17px 17px 17px;  -webkit-transition: opacity 0.7s linear;-webkit-transition: all 0.7s ease-in-out;-moz-transition: all 0.7s ease-in-out;-o-transition: all 0.7s ease-in-out;} .bubble img {margin-bottom:10px; margin-top:-2px;} #vertical {position:fixed; width:10px; right:30px; bottom:0px; height:260px; background-image:url('http://25.media.tumblr.com/tumblr_ly0ae2N4hE1r9g6hvo6_r1_1280.png'); background-color:#f8c76f; -moz-border-radius: 10px 10px 0px 0px; border-radius:10px 10px 0px 0px; } #bubble1 {border:3px solid #9ec1f2; background-color:#fff}  #bubble1:hover {padding:5px; height:50px; width:120px; border:3px solid #4680d2;} #bubble2 {border:3px solid #f795bc; background-color:#fff;}  #bubble2:hover {padding:5px; height:50px; width:120px; border:3px solid #be2a65;} #music {border:3px solid #acacac; background-color:#fff; padding:14px 0px 10px 0px;}  #music:hover {padding:5px; height:50px; width:50px; border:3px solid #111;} #bubbleplayer{padding:2px 0px 5px 0px;}

Luego buscamos La Etiqueta:

</body>

Y DEBAJO De ello colocamos:


<div id='vertical'></div> <div id='bubblebar'> <div class='bubble' id='bubble1'><img src="http://media.tumblr.com/tumblr_lkl6900eU61qfamg6.gif"/> <div>bubble 1 text here</div> </div><!--bubble1-->   <div class='bubble' id='bubble2'><img src="http://i11.photobucket.com/albums/a168/evelynregly/minigifs/minicaderno2.gif"/> <div>bubble 2 text here</div>     </div><!--bubble2-->   <div class='bubble' id='music'><img src="http://static.tumblr.com/rltvkjt/jwflmr3vh/marcadores71.gif"/> <div id='bubbleplayer'>MUSIC PLAYER CODE</div> </div><!--music bubble--> </div><!--bubbleblar-->
 
 
 
* El codigo en ROJO puedes editar cambiandole la imagen y  
agregarle URL 
 
* El codigo de color ROSA por el texto que decees
 
^^ 

Espero les sirva
 
VISTA PREVIA 
  


14 de septiembre de 2012 21:30
Posted by — かすみ. - » 1 Comment(s)


© 2011 - 2017 Berry ♡ Milk. All rights reserved.