domingo, 22 de enero de 2012

Efecto mostrar/desvanecer barra de navegación de blogger

El siguiente codigo debe ser pegado al final de la cabecera </HEAD>

<script src='http://www.google.com/jsapi'/><script>
google.load(&quot;prototype&quot;, &quot;1.6.0.2&quot;);
google.load(&quot;scriptaculous&quot;, &quot;1.8.1&quot;);
</script>
<script type='text/javascript'>
function navbarShow() {
new Effect.Opacity(&#39;navbar-iframe&#39;, {duration:0.5, from:0.0, to:1.0});
}
function navbarHide() {
new Effect.Opacity(&#39;navbar-iframe&#39;, {duration:0.5, from:1.0, to:0.0});
}
function navbarHack() {
Event.observe(&#39;navbar-iframe&#39;, &#39;mouseover&#39;, navbarShow, false); Event.observe(&#39;navbar-iframe&#39;, &#39;mouseout&#39;, navbarHide, false); navbarHide();
}
Event.observe(window, &#39;load&#39;, navbarHack, false);
</script>

Hay que comprobar si ya estamos importando las librerías de java prototype.js o scriptaculous.js.Si ya los tenemos debemos quitar el primer <script>..</script>

<script src='http://www.google.com/jsapi'/><script>
google.load(&quot;prototype&quot;, &quot;1.6.0.2&quot;);
google.load(&quot;scriptaculous&quot;, &quot;1.8.1&quot;);
</script>

Al incrustar este código al final del apartado <HEAD>, hace que durante unos segundos y hasta que procesa todo el código, la barra de navegación de blogger se vea activa, mostrando al usuario que existe tal opción que después desaparecerá,

 y subiendo el puntero hacia su posición, se hará visible.

0 comentarios:

Publicar un comentario

 
Design by Free WordPress Themes | Bloggerized by Lasantha - Premium Blogger Themes | Online Project management