jQuery的淡出onscroll不工作

-2

<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>

来源

2014-10-30 shebil Nalakath

你需要用在DOM准备代码 – 2014-10-30 08:18:18

你需要放置的jQuery的document.ready函数内部代码。当代码被执行，否则的HTML元素不会被加载：

Fiddle Demo

$(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"); 
    } 
    }); 
});

来源

2014-10-30 08:22:47 Shaeldon

jQuery的淡出onscroll不工作

回答

相关问题