动画幻灯片叠加并单击隐藏

Question

我已创建面板框，每个面板我想打开叠加div。第一次它工作正常，但当我点击另一个面板时，它无法正常工作。 这是演示：

Demo

$(this, '.panel').click(function () {
    $('.overlay').animate({
        left: '0px',
    });
});
$('.clbtn').click(function () {
    $('.overlay').stop().hide('4000')
});

Answer 1

我想我已经缩小了你所拥有的问题。

问题是你隐藏了

$('.overlay')

元素，但永远不会再次出现：

.show()

我附上了JSFiddle，表明它不止一次工作。

希望有所帮助

Answer 2

而不是：

$('.overlay').stop().hide('4000')

试试这个：

$('.overlay').stop().css('left', '-100%');