viernes, 20 de enero de 2012

Menu Lateral Flotante



chicas este tuto lo pondre asi de rapidito pues no tengo tiempo hoy gomene TvT igual espero sea de su agrado =D

Da clic para verla en tamaño grande





Como todos los tutos que pongo es muy sencillo okaaaa ^^ bien empezemos

1.- Entra a tu blog

2.- Ve a la pestañita que dice "diseño"

3.- Dentro de ahi da clic en la subpestañita que dice "Elementos De Pagina"

4.- Añade un Gadget HTML/JAVASCRIPT


5.- Pega el siguente codigo:



<style type="text/css">
#gb{
position:fixed;
top:250px;
z-index:+1000;
}
* html #gb{position:relative;}


.gbcontent{
float:left;
}
</style>

<div id="gb">
<div class="gbtab" onclick="showHideGB()"> </div>
<div class="gbcontent">

<a href="URL O DIRECCION DE TU ENTRADA"><img src="http://i1085.photobucket.com/albums/j433/Annyz-chan/afi.png" width="70" border="0" height="100" /></a><br />

<center><a href="URL O DIRECCION DE TU ENTRADA"><img src="http://i1085.photobucket.com/albums/j433/Annyz-chan/tutu3.png" width="80" border="0" height="100" /></a><br />

<a href="URL O DIRECCION DE TU ENTRADA"><img src="http://i1085.photobucket.com/albums/j433/Annyz-chan/premio.png" width="70" border="0" height="100" /></a><br />

<a href="URL O DIRECCION DE TU ENTRADA"><img src="http://i1085.photobucket.com/albums/j433/Annyz-chan/tutu4.png" width="70" border="0" height="100" /></a><br /></center>

<div style="text-align:right">
<a href="javascript:showHideGB()">
</a>
</div>


<script type="text/javascript">
var gb = document.getElementById("gb");
gb.style.right = (80-gb.offsetWidth).toString() + "px";
</script></div></div>



Color Rosa: Url o Direccion de la entrada

Color Morado: url o Direccion de la imagen

Notita: AL poner el codigo ya va incluido el menu asi como lo tengo yo, si ustedes gustan poner otro tipo de imagenes y letras solo es cuestion de hechar a volar la imaginacion para que quede el menu a su estilo ya mas personalizado ^^



21 comentarios:

  1. OwO .. tenes ese menu en tu blog? ahora?
    ._. por que en toodos los dias q eh entrado a tu blog no me aparecia esa barrita lateral jajaj
    xDD por otro lado buen tutoo *¬* lo pondre a mi blog......gracias linda ^^

    ResponderEliminar
  2. OHH!! GRACIAS por esta entrada

    lo intentaré en mi blog :)Deseame suerte *-*

    Saludos

    ResponderEliminar
  3. Suerte Kandra =D veras que te queda bien lindo ^^

    ResponderEliminar
  4. PASHIIII quiza sea por el navegador que usas que no lo ves ^^ ammm porque no pruebas con mozilla se mira mejor.. cual navegador utilizas?

    ResponderEliminar
  5. jajaja usoo google chrome xD
    y pus si me suponia esooo asi k fui a explorer y ahiii si se notoo xD

    ResponderEliminar
  6. Hola, pasa por mi blog annyz que te tengo un premio

    espero que te guste

    ResponderEliminar
  7. espero que te guste el premio que te tengo en mi blog annyz

    pasa por mi blog para agarrarlo

    ResponderEliminar
  8. arigatoo =D grax por el premio ^^ em pasas la direccion para pasar a recogerlo?

    ResponderEliminar
  9. Kon'nichiwa n.n quería preguntarte.. ¿es necesario que saque las imagenes de photobucket?Jizen ni kansha ^^

    ResponderEliminar
  10. Sakura:

    nop puedes ponerlos en cualquier servidor que mas confianza te de o ya de plano solo de tu pc xD saludos

    ResponderEliminar
  11. Muchas gracias me fue bastante útil n_n

    ResponderEliminar
  12. Hola! A mi me pasa que se me pone en el medio la imagen! Se mueve y es tal cual, pero se me centra! Como hago? PLZ!! AYUDAA

    ResponderEliminar
  13. hola, annyz me encanta tu blog jeje y me gustaria que visitaras mi blog jeje http://myoncat.blogspot.com/ ^-^ me gustaria que una kpa bloguera lo visite jeje ^.^ bss

    ResponderEliminar
  14. Hola annyz gracias tu blog me hizo decorar el mio aunque sea un poco nuevo y no tenga muchos seguidores,te lo dejo http://amanecer-smk.blogspot.com/ para que lo visites espero te guste (;

    ResponderEliminar
  15. de nada nena, me da gusto que te agrade mi blog y lo decores con las cositas que aqui pongo =D .

    ResponderEliminar
  16. omg =D gracias HONEY ya me paso por tu blogui n.n

    ResponderEliminar
  17. me encanto la entrada pero como puedo ponerlo mas arriba o en su defecto arriba?

    ResponderEliminar
  18. nop nena asi es el script y esa es toda la altura que puedes ponerlo x.x saludos

    ResponderEliminar
  19. Graaax annyz x el tuto, me qedo bn lindo, aunque hice unos cambios y se me fue todo para la miercoles xDD bueno ahora lo estoy arreglando para que quede mas ordenadito -w- besos si qieres pasate x mi blog: ichigo-freshita.blogspot.com
    saludos! TKM :)

    ResponderEliminar

Nota: solo los miembros de este blog pueden publicar comentarios.