Diferencia entre revisiones de «Fortun»
Ir a la navegación
Ir a la búsqueda
| Línea 1: | Línea 1: | ||
DOCU FORTUN | DOCU FORTUN | ||
| + | <br> | ||
Hacer la barra de menú más pequeña | Hacer la barra de menú más pequeña | ||
| − | 1. Primero tenemos que añadir esto en css: | + | <br> |
| + | '''1.''' Primero tenemos que añadir esto en css: | ||
/* Ajusta el height del menú se puede poner el tamaño que quieras*/ | /* Ajusta el height del menú se puede poner el tamaño que quieras*/ | ||
| Línea 13: | Línea 15: | ||
} | } | ||
| − | 2. Para que esto no cambie cada vez que aparece el sticky tenemos que añadir lo siguiente en jQuery: | + | '''2.''' Para que esto no cambie cada vez que aparece el sticky tenemos que añadir lo siguiente en jQuery: |
jQuery(document).ready(function( $ ){ | jQuery(document).ready(function( $ ){ | ||
Revisión del 11:53 3 ago 2020
DOCU FORTUN
Hacer la barra de menú más pequeña
1. Primero tenemos que añadir esto en css:
/* Ajusta el height del menú se puede poner el tamaño que quieras*/
.nav-menu {
line-height: 78px;
}
/* Ajusta el height del fondo para que no se vea el blanco el tamaño tiene que ser igual que el del menú*/
.spacer{
height: 78px!important;
}
2. Para que esto no cambie cada vez que aparece el sticky tenemos que añadir lo siguiente en jQuery:
jQuery(document).ready(function( $ ){
shrinkInit($);
});
/* comprueba si existe la clase y cambia el color del texto de forma acorde DE FORMA RECURSIVA CADA 0.5s */
function shrinkInit($){
function check_shrink(){
if ( $(".header-navigation-menu").hasClass("shrink-header-menu") ) {
$(".nav-menu").attr('style', 'line-height: 50px !important');
} else {
$(".nav-menu").css("line-height", "78px");
}
}
window.setInterval(check_shrink,100);
}