У меня есть следующий скрипт, который вставляет / выдвигает DIV справа:

// jQuery 1.9 > Toggle Event dep 1.8
$('#slideClick').click(function () {
    var it = $(this).data('it') || 1;
    switch (it) {
        case 1:
            $(this).parent().animate({ right: '-290px' }, { queue: false, duration: 500 });
            $("#imgArrow").attr("src", "../theImages/arrow_expand.png");
            break;
        case 2:
            $(this).parent().animate({ right: '-0px' }, { queue: false, duration: 500 });
            $("#imgArrow").attr("src", "../theImages/arrow_collapse.png");
            break;
    }
    it++;
    if (it > 2) it = 1;
    $(this).data('it', it);
});

HTML-код в MasterPage, который соответствует приведенному выше сценарию:

<div id="slideOut" class="clearfix">
    <div id="slideContent">
        <div style="width: 98%; margin: 0 auto; padding: 5px;">
            <div id="dvImpMsgs" style="padding-left: 10px; padding-right: 10px;">
                <asp:UpdatePanel runat="server" ID="upMessage" ClientIDMode="Static" UpdateMode="Conditional">
                    <ContentTemplate>
                        <asp:Label ID="lblMessage" Font-Size="x-small" runat="server" Text="" ClientIDMode="Static"></asp:Label>
                    </ContentTemplate>
                </asp:UpdatePanel>
            </div>
        </div>
    </div>
    <div id="slideClick">
        <div style="padding: 0; margin: 0 auto; width: 100%; height: 100%; text-align: center;">
            <div class="arrowMsg">
                <img src="../theImages/arrow_collapse.png" id="imgArrow" style="width: 12px; height: 18px; border: 0; vertical-align: middle;" />
            </div>
            <div style="width: 80px; height: 50px; float: right; margin: 0; padding: 0;">
                <div style="width: 80px; height: 30px; text-align: center; line-height: 30px; vertical-align: middle;" class="brClear">
                    <img src="../theImages/iMsg.png" style="width: 30px; height: 30px; border: 0" />
                </div>
                <div style="color: #FFFFFF; width: 80px; height: 20px; text-align: center; line-height: 20px; vertical-align: middle; font-size: 10px;" class="brClear">
                    MESSAGES
                </div>
            </div>
        </div>
    </div>
</div>

Каждый раз, когда пользователь заходит на страницу, выпадающее меню истинно, что заставляет пользователя нажиматьslideclick DIV, чтобы закрыть его, что может стать недружественным для пользователя.

Как я могу использовать куки или сеанс, чтобы могло произойти следующее:

При первом посещении пользователем показывается DIV в выдвижном положении, когда он нажимаетslideclick DIV, чтобы спрятаться. Он будет оставаться скрытым от пользователя до тех пор, пока браузер не закроется. В этом случае, как только пользователь снова откроет браузер, DIV должен находиться в выдвижном положении, пока пользователь не нажметslideclick DIV, чтобы спрятаться, и так далее.

выдвижная позиция:

скрыть позицию: