Question

当我点击带有类名＆＃39;显示＆＃39;的div时，我将css添加到div＆＃39; mobile-menu＆＃39;，这很完美，但我想当我点击类名＆＃34;显示＆＃34;时将css更改为另一个高度再次

$(".show").click(function() { 
$('#mobile-menu').css({ 'height': '100%' });
// when i click on .show again: .css({ 'height': '51px' });
});

Answer 1

试试这段代码。

$(".show").click(function() { 
    if ($('#mobile-menu').css('height') === '100%')
        $('#mobile-menu').css({ 'height': '51px' });
    else
        $('#mobile-menu').css({ 'height': '100%' });
});

Answer 2

    <style>
      .highlight{
        height: 100%;
      }
    </style>
    $('.show').click(function() { 
        $('#mobile-menu').toggleClass( "highlight" );
    });

Answer 3

您需要设置一个布尔值，指示#mobile-menu

的状态

var isFullHeight;
$(".show").click(function() { 

    if (isFullHeight)
    {
         $('#mobile-menu').css({ 'height': '51px' });
         isFullHeight = false;
    }
    else
    {
        $('#mobile-menu').css({ 'height': '100%' });
        isFullHeight = true;
    }
});

Answer 4

尝试这样的事情：

$(".show").click(function() { 
    var clicks = $(this).data('clicks');
    if (clicks) {
        // odd clicks
        $('#mobile-menu').css({ 'height': '100%' });
    } else {
        // even clicks
        // when i click on .show again: .css({ 'height': '51px' });
    }
});

Answer 5

我在这些案件中所做的是

$('.someClass').toggleClass('someClass'); //removes someClass from all elements using someClass
$(this).toggleClass('someClass');

这会在所有选择器上添加和删除一个类

Answer 6

试试这段代码：

$(".show").toggle(function(){
$(#mobile-menu).css({height:40});
},
function(){
$(#mobile-menu).css({height:10});
});

单击另一个div时更改（切换）css

6 个答案: