jQuery Toggle function
<pre><code>$(document).ready(function () {
        $(".LeftColumn").hide();
        $(".SidebarToggle").toggle(function () {
            $(this).addClass("active");
            $(this).text("Hide Sidebar");
            $(this).attr("title", "Hide Sidebar");
            $(".LeftColumn").fadeIn("fast");
            return false;
        },
        function () {
            $(this).removeClass("active");
            $(this).text("Show Sidebar");
            $(this).attr("title", "Show Sidebar");
            $(".LeftColumn").fadeOut("fast");
            return false;
        });

        $(document).mouseup(function () {
            $('.LeftColumn').fadeOut('fast');
            $('.SidebarToggle').removeClass("active");
            $('.SidebarToggle').text("Show Sidebar");
        })
    });
</code></pre>

<p>The problem I have is when the user clicks elsewhere on the page it will hide the LeftColumn as I want, but the Toggle function doesn't know this so when the user clicks the SidebarToggle link it wont show the LeftColumn as it treats it as hiding. How can I fix this?</p>

<p>Thanks</p>
