Twitter bootstrap 3 带Bootstrap3的浮动右面板

我有一个全宽度的模板，左侧有一个侧边栏。主内容区域被包装在中。我想添加搜索按钮，如果用户点击它，那么一个完整的高度搜索边栏应该出现在右边的col-3大小。此外，主要内容区域应缩小到第9列。当然，我可以通过在div上切换必要的类来使用javascript。但在这种情况下，搜索面板将显示在小型设备上的主要内容下。但我需要在主要内容上面展示它。同样，宽屏幕-侧边栏必须显示在右边的col-3，小屏幕-侧边栏必须显示在主内容上方的全宽度。有可能吗？

请查看此问题的答案谢谢，这似乎正是我想要的。这解决了div顺序的问题，但我仍然使用javascript切换col类和侧栏的可见性。可能还有更优雅的解决方案吗？例如，我想在单击时显示边栏div，内容区域会自动缩小。如果未设置宽度，Div块将自动扩展。不幸的是，当侧边栏未隐藏时，如果没有col-lg-9，它不会收缩。它只需要全宽，并使边栏转到下一行。