Question

我花了最后90分钟左右试图解决这个问题。我有一个使用JQuery动画的网站，以及出现在动画结尾的2个链接。当您单击任一链接时，div会淡入以显示更多链接。到目前为止一切正常（作为参考，链接1是“然后”，链接2是“现在”）。

我想要发生的是让用户点击“然后”。现在他想点击“现在”。我希望“Then”div淡出，“Now”div淡入。反之亦然。我觉得我的代码几乎就在那里，但我是一个完整的JS noob，似乎无法得到它。我也不想破坏我已经试图解决的问题。代码如下：

//then + now animation

var thennav = document.getElementById('#thennavbox');
var nownav = document.getElementById('#nownavbox');

$(document).ready(function(){
$('#then').click(function(){
    $('#thennavbox').fadeIn(1000);
});

$('#now').click(function(){
    $('#nownavbox').fadeIn(1000);
});
});//end onclick animation

if(thennav.style.display=='none'){
    $('#nownavbox').fadeOut(1000, function(){
        $('#thennavbox').fadeIn(1000);
        });
    };

if(nownav.style.display=='none'){
    $('#thennavbox').fadeOut(1000, function(){
        $('#nownavbox').fadeIn(1000);
        });
    };//end if statements

//end then + now animation

像我说的那样，一切都按照预期消失了。我只是不能让一个淡出而另一个淡出。我想也许我的if语句在错误的地方。

Answer 1

$('#then').click(function(){
    $('#thennavbox').fadeIn(1000);
    $('#nownavbox').fadeOut(1000);

});

$('#now').click(function(){
    $('#nownavbox').fadeIn(1000);
    $('#thennavbox').fadeOut(1000);
});

JQuery OnClick动画和if语句

1 个答案: