Este foro ya no está activo, así que no puedes publicar nuevas preguntas ni responder a las preguntas existentes.

Cambiar el comportamiento del menú responsive de Bootstrap

2 de julio de 2015

Buenos días.

Una duda... necesito cambiar el momento cuando se hace el menú resonsive. Actualmente se hace a los 767px, y necesitaria que fuera responsive a partir de los 992px. ¿Me pueden ayudar?

Para que se hagan una idea, estoy usando un menu similar a este: http://www.stampede-design.com/demo/bootstrap-pushnav/menu-left.html

Gracias de antemano.


Respuestas

#1

Una forma de conseguirlo sería coger los archivos originales de Bootstrap, cambiar el valor de las variables que controlan cuándo se "rompen" o "adaptan" las cosas y compilar el resultado en un archivo CSS de Bootstrap personalizado.

Otra forma de conseguirlo, sería copiar las reglas CSS que Boostrap aplica a 767px y aplicarlas a 992px. Para ello, siguiendo las instrucciones de este artículo podrías hacer lo siguiente:

@media (max-width: 992px) {
    .navbar-header {
        float: none;
    }
    .navbar-left,.navbar-right {
        float: none !important;
    }
    .navbar-toggle {
        display: block;
    }
    .navbar-collapse {
        border-top: 1px solid transparent;
        box-shadow: inset 0 1px 0 rgba(255,255,255,0.1);
    }
    .navbar-fixed-top {
        top: 0;
        border-width: 0 0 1px;
    }
    .navbar-collapse.collapse {
        display: none!important;
    }
    .navbar-nav {
        float: none!important;
        margin-top: 7.5px;
    }
    .navbar-nav>li {
        float: none;
    }
    .navbar-nav>li>a {
        padding-top: 10px;
        padding-bottom: 10px;
    }
    .collapse.in{
        display:block !important;
    }
}

@javiereguiluz

5 julio 2015, 17:38