Question

在我的网页（www.reddle.nl/frankendael）上，我希望当导航图标（在网站的左上角）有一个open类时，导航菜单必须消失。

为此，我使用以下jQuery代码：

jQuery(document).ready(function($) {
    $('#nav-icon1').click(function(){
        $(this).toggleClass('open');
    }); 
    if ($('.open').length > 0) { 
        $('#nav-icon1').click(function(){
            $('.main-navigation').css('marginLeft','-999px')
        });
    } else {
        $('#nav-icon1').click(function(){
            $('.main-navigation').css('marginLeft','55px')
        });
    }
});

但它不起作用。导航菜单出现，但不会消失。有谁知道如何解决这个问题？

Answer 1

像这样：

<?php
$yes = array('this', 'is', 'an array');

echo is_array($yes) ? 'Array' : 'not an Array';
echo "\n";

$no = 'this is a string';

echo is_array($no) ? 'Array' : 'not an Array';
?>

编辑，如果你想用更多的css运行它：

jQuery(document).ready(function($) {
    $('#nav-icon1').click(function(){
        $(this).toggleClass('open');
        if ($(this).hasClass('open') { 
            $('.main-navigation').css('marginLeft','-999px')
        } else {
            $('.main-navigation').css('marginLeft','55px')
        }
    }); 
});

Answer 2

使用单击处理程序及其中的条件。
toggleClass()的行应该是最后一行，否则if()条件会反过来。
您可以使用三元操作进一步减少css()修改。

$('#nav-icon1').click(function(){            
    $('.main-navigation').css('marginLeft',$(this).hasClass('open') ? '-999px' : '55px')
    $(this).toggleClass('open');
});

导航菜单关闭时不会消失

2 个答案: