Estoy usando bootstrap para construir una página. Tengo una sección en la que hay 6 secciones diferentes (3 en una fila).
Lorium ispum Lorium ispum Lorium ispum Lorium ispum Lorium ispum Lorium ispum Estoy tratando de expandir un col al ancho completo del contenedor sobre el mouse. Mientras tanto, las otras secciones del col desaparecerán.
Traté de adaptarme para ocultar los 5 cols en el mouse sobre jQuery. Pero no sé cómo expandir el contenedor. ¿Alguien puede ayudarme a resolver esto? Si necesitas ayuda, házmelo saber.
Puedes usar el método de vuelo estacionario de jQuery:
$('.col-md-4').hover(function () { var $this = $(this); $this.removeClass('col-md-4').addClass('col-md-12'); $this.siblings('.col-md-4').hide(); }, function () { var $this = $(this); $this.removeClass('col-md-12').addClass('col-md-4'); $this.siblings('.col-md-4').show(); });
Aquí hay un jsFiddle de trabajo: http://jsfiddle.net/k958H/