Question

我正在尝试使用bootstrap创建一个站点，我遇到了一个问题，我几乎可以解决问题。我想要做的是在md-2节目中有一个div并在按下按钮时隐藏。关键是我希望主div在隐藏时位于12，而当它存在时位于10以容纳左栏。

我可以毫无问题地展示和隐藏它，但我似乎可以让主要的div相应地移动。我可以改变它的类，但我不能让主显示“移动”以适应它。可以使用此jquery

在下面的小提琴中查看会发生什么

 $('#layerbutton').click(function () {
  $(".map").toggleClass('col-md-12 col-md-10');
  $("#tree").toggle("slide");
});

http://jsfiddle.net/ujcdrj46/1/

我觉得有一个简单的解决方案，但我只是没有知识来弄明白。感谢您提供的任何帮助。

另外，请原谅长长的小提琴，我不能让它以任何其他方式工作。

Answer 1

您可以链接.toggleClass()方法以实现所需的效果Demo

$('#layerbutton').on('click', function() {
   $('#map').toggleClass('col-xs-10 col-md-10').toggleClass('col-xs-12 col-md-12');
   $("#tree").toggle("slide");
});

注意：我在周围的地图Id上添加了div属性，并添加.col-xs-*以显示此工作在小提琴中。

bootstrap show / hide div left

1 个答案: