al recargar página pierde los estilos de bootstrap Jquery

Amigos tengo el siguiente código:

$(window).resize(function() {
var width = $(window).width();
if (width < 767) {
$('.collapse').collapse('hide')
}
else {
$('.collapse').collapse('show')
}
});


Cuando redimensiono a menos de 767px el menu se vuelve collapsable "clase de boostrap" y si maximizo se descolapsa está perfecto pero el problema es cuando redimensiono a menos de 767px perfecto se collapsa PERO SI RECARGO LA PAGINA PIERDE LA CLASE COLLAPSE Y SE DESCOLAPSA.

AYUDA POR FAVOR. GRACIAS

El chequeo lo haces cuando reescalas la pagina ... pero lo haces cuando carga?

Jorge

Cuando reescalo la página funciona perfecto, pero por ejemplo si lo dejo en menos de 767px y recargo la página pierde las clases y vuelve a su estado normal.


Lo que quiero es que si esta en menos de 767px el viewport recargue la página en esas dimensiones y no pierda las clases y quede collapsado.


Eso es me entiendes???


Saludos amigo

... pero lo haces cuando carga?

Eso quiere decir:

Código :

$(document).ready(function() {
   var width = $(window).width();
   if (width < 767) {
      $('.collapse').collapse('hide')
   } else {
      $('.collapse').collapse('show')
   }    
});

Eso es me entiendes???

Saludos amigo

Por ejemplo si yo lo cargo en un celular no funciona no se collapsa, sin embargo si estoy en notebook o pc de escritorio escalo y funciona.


Eso es me entiendes???