Как скрыть меню? (не «переключаться»)

0

У меня есть страница, состоящая из двух слоев: "layer1" - это меню, и у него есть z-index: 1; "layer2" заполнен содержимым и имеет z-индекс: 2.

Я пытаюсь сделать это так: когда вы нажмете на стрелку pic, "layer2" движется вправо (например, 200 пикселей) за экраном. Я не знаю, правильный ли код в этой ситуации, но это то, что я использую:

    $('#arrow').click(function() {
        $(this).animate({
            marginRight: '+=200'
            }, 500);
        $('#layer2').animate({
            marginLeft: '+=200'
        }, 500)});

Как я могу сделать "layer2" назад, когда вы нажимаете стрелку второй раз?

  • 0
    Понизьте z-index .
Теги:

1 ответ

0
Лучший ответ

следить за состоянием, это можно кодировать лучше, но это основная идея.

$('#arrow').click(function() {
    var elem = $(this);
   var state = elem.data("state") || "closed";
   var dir = (state === "open") ? "-" : "+";
   elem.data("state", state === "open" ? "closed" : "open");
   elem.animate({
        marginRight: dir + '=200'
        }, 500);
   $('#layer2').animate({
        marginLeft: dir + '=200'
    }, 500);
});

Ещё вопросы

Сообщество Overcoder
Наверх
Меню