jQuery Question

How can I move to left (hide) a <div> with JQuery when load a page?

I would like hide a

<div>
to user but he/she can't see the process for hidden and the other pages elements use the this div space.

My page:

<div id="wrapper">
<div id="sidebar-wrapper">
<ul class="sidebar-nav">
<li>
<a href="#">Link 1</a>
</li>
</ul>
</div>
<div> content...</div>
</div>


I searched for all sites but I two ways different to I like.


  1. hide div but the div space is static and another html objects don't use this space.

    $('#sidebar-wrapper').toggle();

  2. hide div but user sees the process.

    $("#wrapper").toggleClass("toggled");



Thank you!

Answer

Thank you for all.

This is my solution:

var tamAnterior = $(window).width();
var tamActual = tamAnterior;
$(window).resize(function(){
    tamActual = $(this).width();
    if((tamAnterior < 767 && tamActual >= 767) || (tamActual < 767 && tamAnterior >= 767)){
        $("#wrapper").toggleClass("toggled");
    }
    tamAnterior = $(this).width();
});
Comments