切换Div容器高度

时间:2014-01-04 14:55:51

标签: jquery css

我正在处理一个按钮,在该按钮上应用切换并且div高度增加和减少。 所以我想要做的就是在按钮上点击#about点击#aboutsubmenu节目,#maincontainer的高度会增加,如果它打开就会关闭。 这是我想要做的事情

$(document).ready(function() {
    $('#aboutsubmenu').hide();
    var opened;
    var opened2;
    $('#about').click(function() {
        opened = "no";
        if (opened == "no") {
            $('#aboutsubmenu').show();
            $('#maincontainer').css('height', '387px');
            opened = "yes";
        }
        else if (opened == "yes") {

        }
    });
});

我在这里完全糊涂了。你能救我吗?

2 个答案:

答案 0 :(得分:3)

试试这段代码:

$(document).ready(function () {
    $('#aboutsubmenu').hide();
    var opened = false;
    $('#about').click(function () {
        $('#aboutsubmenu').toggle(); // Toggle visibility
        $('#maincontainer').height(opened ? 387 : 100);
        opened = !opened;
    });
});

你做错了什么:

opened = "no";

函数开头的代码使它打开。

答案 1 :(得分:1)

试试这个,在事件处理程序外初始化变量

var opened = "no"; //
var opened2;
$('#about').click(function () {
    if (opened == "no") {
        $('#aboutsubmenu').show();
        $('#maincontainer').css('height', '387px');
        opened = "yes";
    } else if (opened == "yes") {
        $('#aboutsubmenu').hide();
        $('#maincontainer').css('height', '100px');
        opened = "no";
    }
});