cómo expandir un div col en bootstrap en vuelo estacionario

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/