Bootstrap колона, за да се плъзгат в мобилните телефони - jquery, twitter-bootstrap

Имам оформление col-lg-3 col-lg-9 и искам col-lg-3 да бъде плъзгащо се меню, когато посещавам на мобилни устройства (което означава col-sm-3 и col-xs-3).

Искам да има бутон, плаващ отляво на страницата, който да казва "Меню" и когато щракнете върху него, менюто да се плъзга в

Това е само за оформлението col-sm-3 и col-xs-3.

Някакви предложения за това?

Това е моят код

<div class="container">
<aside class="col-lg-3 col-md-3">
<div id="filters">
this should be slide in when on mobile
</div>
</aside>
<div class="col-lg-9 col-md-9">
body
</div>
</div>

Отговори:

РЕДАКТИРАНЕ:

Забравих за плъзгащото се нещо, сега е готово: JS Fiddle

Кодът:

JQuery

$(document).ready(function () {
$("#slide").hide();
});

$("#slide_button").click(function () {
$("#slide").slideToggle("slow");
});

HTML

<div class="container">
<aside class="col-lg-3 col-md-3">
<div id="filters" class="col-lg-12 col-md-12 hidden-xs hidden-sm">
<!-- Other content -->
</div
<div class="hidden-lg hidden-md col-xs-12 col-sm-12 text-center">
<button id="slide_button">Slide it</button>
<div id="slide">I"m some sliding content</div>
</div>
</aside>
<div class="col-lg-9 col-md-9"></div>
</div>