jquery淡出onscroll不工作_Jquery

jquery淡出onscroll不工作

jquery

jquery淡出onscroll不工作,jquery,Jquery,jquery不工作 <head> <meta http-equiv="Content-Type" content="text/html; charset=utf-8" /> <title>Untitled Document</title> <script src="http://ajax.googleapis.com/ajax/libs/jquery/1.11.1/jquery.min.js"></script> <s

jquery不工作

<head>
<meta http-equiv="Content-Type" content="text/html; charset=utf-8" />
<title>Untitled Document</title>
<script src="http://ajax.googleapis.com/ajax/libs/jquery/1.11.1/jquery.min.js"></script>
<script>
var divs = $('.social, .title');
$(window).scroll(function(){
   if($(window).scrollTop()<5){
         divs.stop(true,true).fadeIn("fast");
   } else {
         divs.stop(true,true).fadeOut("fast");
   }
});
</script>
</head>



<body>
<div class="social">
        <p>Social links here</p>
    </div>

    <div class="title">
        <p>Some text</p>
    </div>

<div class="banner">
    <img src="http://lorempixel.com/920/700/" alt="">
</div>
<p>Text to simulate scrolling</p>
<p>Text to simulate scrolling</p>
<p>Text to simulate scrolling</p>
<p>Text to simulate scrolling</p>
<p>Text to simulate scrolling</p>
<p>Text to simulate scrolling</p>
<p>Text to simulate scrolling</p>
<p>Text to simulate scrolling</p>
<p>Text to simulate scrolling</p>
<p>Text to simulate scrolling</p>
<p>Text to simulate scrolling</p>
<p>Text to simulate scrolling</p>
<p>Text to simulate scrolling</p>
<p>Text to simulate scrolling</p>
<p>Text to simulate scrolling</p>
<p>Text to simulate scrolling</p>
<p>Text to simulate scrolling</p>
<p>Text to simulate scrolling</p>
<p>Text to simulate scrolling</p>
<p>Text to simulate scrolling</p>
<p>Text to simulate scrolling</p>
<p>Text to simulate scrolling</p>
<p>Text to simulate scrolling</p>
<p>Text to simulate scrolling</p>
<p>Text to simulate scrolling</p>
<p>Text to simulate scrolling</p>
<p>Text to simulate scrolling</p>
<p>Text to simulate scrolling</p>
<p>Text to simulate scrolling</p>
<p>Text to simulate scrolling</p>
<p>Text to simulate scrolling</p>
<p>Text to simulate scrolling</p>
<p>Text to simulate scrolling</p>
<p>Text to simulate scrolling</p>
<p>Text to simulate scrolling</p>
<p>Text to simulate scrolling</p>
<p>Text to simulate scrolling</p>
<p>Text to simulate scrolling</p>
<p>Text to simulate scrolling</p>
<p>Text to simulate scrolling</p>


</body>
</html>

您需要将代码放在jquery的Document.ready函数中。否则，在执行代码时不会加载HTML元素：

您需要将代码包装到dom ready中

$( document ).ready(function() {
var divs = $('.social, .title');
   $(window).scroll(function(){
     if($(window).scrollTop()<5){
         divs.stop(true,true).fadeIn("fast");
     } else {
         divs.stop(true,true).fadeOut("fast");
     }
    });
});