使弹出窗口在5秒后淡入淡出并在关闭时淡出

Question

这是我的代码：https://jsfiddle.net/hb4bb761/

弹出窗口目前立即出现。如何在5秒钟后显示它？如何在它出现时使其淡入？

还有一种方法可以让它在关闭时逐渐消失吗？

这是有问题的js：

$(function(){
$('#screen, #modal').show();
});

$('#screen, #modal button').click(function(){
$('#screen, #modal').hide();
});

Answer 1

jQuery已经提供了这样的功能，您可以使用fadeIn()和fadeOut()

我在这里调整了fiddle

如果您想延迟执行，可以使用delay()。

$('selector').delay(5000).fadeIn(1000)