如何在頁面加載時淡入 div？

Question

我正在使用 jQuery。 我需要一個 div 在頁面加載時淡入。

<div id=monster></div>

我怎樣才能做到這一點？

Answer 1

再簡單不過了：

$(function(){  // $(document).ready shorthand
  $('#monster').fadeIn('slow');
});

如果您的 div 最初沒有隱藏，您可以在動畫之前隱藏它：

 $('#monster').hide().fadeIn('slow');

速度參數可以是'slow' 、 'normal' 、 'fast'或運行動畫的毫秒數。

Answer 2

jQuery/淡入淡出

$(function() {
    $("#monster").fadeIn();
});

Answer 3

查看工作演示

 $('#monster').hide().fadeIn('slow');

 #monster{ width: 200px; height: 100px; border: 1px solid #0095ff; border-radius: 5px; }

 <script src="https://cdnjs.cloudflare.com/ajax/libs/jquery/3.3.1/jquery.min.js"></script> <div id=monster> <pre> This is demo text. This is demo text. This is demo text. This is demo text. </pre> </div>