爲什麼不是fadeIn選項工作？

Question

</header> 
<section id="video"> 
<video autoplay loop class="video"> 

<source src="ink.mp4" type="video/mp4"> 
</video> 
</section> 
<section id="meat"> 
<P> 
<span class="first"> XXXXXX</span> 
<br/> 
<span class="second"> xxxxx </span> 
</P> 
</section> 
<footer id="end_page"> 
</footer> 
<script> 
$(document).ready(function(){ 
$("#meat"). fadeIn("slow"); 
}); 

//我希望內容在頁面加載後緩慢淡入淡出。爲什麼不是fadeIn選項工作？當鼠標懸停在身體​​的內容上時，如何顯示導航欄？

謝謝

Answer 1

您在顯示項目之前忘記隱藏了。由於它已經可見，jQuery什麼也沒做。關於你的第二個問題，我們可以添加一個hover事件：

$(document).ready(function(){ 
 
    $("#meat").hide(); 
 
    $("#meat").fadeIn(3000); 
 
    $("#meat").hover(function(){ 
 
    $("#navbar").stop(true,true).fadeToggle("slow"); 
 
    }); 
 
});

#navbar { 
 
    position:fixed; 
 
    display:none; 
 
}

<script src="https://ajax.googleapis.com/ajax/libs/jquery/2.1.1/jquery.min.js"></script> 
 
</header> 
 

 
<div id="navbar"><a href="#">test</a></div> 
 
<section id="video"> 
 
<video autoplay loop class="video"> 
 

 
<source src="ink.mp4" type="video/mp4"> 
 
</video> 
 
</section> 
 
<section id="meat"> 
 
<P> 
 
<span class="first"> XXXXXX</span> 
 
<br/> 
 
<span class="second"> xxxxx </span> 
 
</P> 
 
</section> 
 
<footer id="end_page"> 
 
</footer>