Edit in JSFiddle

<div class="navbar navbar-inverse navbar-fixed-top">
    <div class="navbar-inner">
        <div class="container">
            <button type="button" id="btnRespNav" class="btn btn-navbar" style="float:left"> <span class="icon-bar"></span><span class="icon-bar"></span><span class="icon-bar">
                    </span>

            </button> <a class="brand" href="#">IMInfo.in</a>

            <div class="nav-collapse collapse">
                <ul class="nav">
                    <li class="active"><a href="#">Home</a>
                    </li>
                    <li><a href="#">About</a>
                    </li>
                    <li><a href="#">Products</a>
                    </li>
                    <li><a href="#">Clients</a>
                    </li>
                    <li><a href="#">Contact Us</a>
                    </li>
                </ul>
            </div>
            <!--/.nav-collapse -->
        </div>
    </div>
</div>
 $(document).ready(function () {
     $('.btn-navbar').sidr({
         name: 'respNav',
         source: '.nav-collapse',
     });
 });

 //this code is close sidr menu if clicked outside  {optional}
 $(document).bind("click", function () {
     $.sidr('close', 'respNav');
 });