当它可见时自动淡出 Div


Automatically fadeOut Div when its visible

我有一个 Div,它会在有会话时出现,否则它将保持隐藏状态。

我想要的是 Div 在几秒钟后自动慢慢淡出它变得可见。

这是我的代码和我到目前为止尝试过的内容:

<?php if(isset($_SESSION['message'])){ ?>
   <div class="message">
    <?php echo $_SESSION['message']; ?>
   </div>
<?php unset($_SESSION['message']); } ?>

Jquery:

<script type="text/javascript">
if( $('.message').is(':visible') ) {
  $(".message").fadeOut(1000);
}
</script>

我面临的问题是 DIV 出现,但它不会自动淡出或消失。另外,控制台中没有错误。

您不需要超时或间隔。甚至运行检查以查看元素是否存在或可见。

您确实需要在文档准备就绪时运行此代码,或者至少在 .message 元素之后运行此代码。

$(document).ready(function(){
  $('.message').delay(5000).fadeOut(300);
});

如果没有.message元素,它不会产生任何负面影响。

问题是您的代码不起作用,因为它仅在 DOM 准备就绪时执行一次。您需要定期检查值。所以在这里你需要做这样的事情

您也可以通过设置超时函数执行此操作

setTimeout(function(){
    if( $('.message').is(':visible') ) 
      $(".message").fadeOut(1000);
},100);

或者正如我上面所说,要执行代码,您必须将其放入 $(document).ready 函数中(当 DOM 准备就绪时)

$(document).ready(function () {
 if( $('.message').is(':visible') ) 
    $(".message").fadeOut(1000);
});