Ya he compartido varios trucos acerca de la navbar de Blogger, en los cuales hemos publicado trucos sobre como eliminarla, o como ponerla en la parte inferior del blog, pero el día de hoy vamos a enseñar como hacer la navbar de Blogger solo visible cuando se pasa el cursor.
Para agregar este truco a tu blog solo debes agregar el siguiente CSS antes de ]]></b:skin
#navbar {
width: 36px;
border-top: 1px solid #888888;
border-right: 5px solid #888888;
position: fixed;
top: 0px;
left: -6px;
background: #fe6602;
border-radius : 0 5px 5px 0;
box-shadow: 0px 1px 3px rgba(0, 0, 0, 0.2);
-moz-transition: all 0.3s linear;
-ms-transition: all 0.3s linear;
-o-transition: all 0.3s linear;
-webkit-transition: all 0.3s linear;
transition: all 0.3s linear;
-moz-transition-delay: 1.3s;
-ms-transition-delay: 1.3s;
-o-transition-delay: 1.3s;
-webkit-transition-delay: 1.3s;
transition-delay: 2.5s;
z-index: 10;
}
#navbar:hover {
width: 96%;
-moz-transition: all 0.6s linear;
-ms-transition: all 0.6s linear;
-o-transition: all 0.6s linear;
-webkit-transition: all 0.6s linear;
transition: all 0.6s linear;
}
Espero que les haya gustado este tutorial y vuelvan a visitar Mil Trucos Blogger y encontraran los mejores recursos para tu blog.
0 comentarios