显示错误消息 3 秒钟,然后淡出


Display error message for 3 seconds and then fades out

根据我的PHP文件返回的内容,我想在网页顶部显示一条消息。

$msg = "Success"; // or fail
$redirecturl = "index.php?msg=".$msg;
header("Location: $redirecturl");

网页代码

<?php   $msg=isset($_GET['msg']) ? $_GET['msg'] : "";?>
<div id="display-success"><?php echo $msg; ?></div>

现在,如果我收到Success消息,我需要打印一个小框,该框出现(3秒钟,然后淡出(,该框以绿色背景显示消息success。如果它failure,那么我想在红色背景中显示一条消息 3 秒钟,然后淡出。

//by using setTime0ut
setTimeout(function() {
   $('#display-success').fadeOut().text('')
}, 10000 );
//by using delay()
$('#display-success').fadeIn().delay(10000).fadeOut();


演示

jquery

$(".showMsg").click(function () {
    $('#display-success').fadeIn().delay(3000).fadeOut();
});

.html

<button class="showMsg">Click Me</button>
<div id="display-success">The error Message</div>