滚动％屏幕

Question

• 如何检测用户是否使用jQuery滚动屏幕的50％？ （在这里我可以说，如果它滚动50像素）
• 然后，动画，去#second或者，有什么不一样，前100％（它似乎动画，但事情发生了疏远）

这里的例子：http://jsfiddle.net/NH6Km/2/

JQUERY：

$(function(){ 
$(window).scroll(function() { 
    if ($(window).scrollTop() > 50) { 
    ('body,html').animate({ scrollTop:    
    $('#second').offset().top }, 1500); 
    } 
});  
}) 

HTML：

<div id="first"></div> 
<div id="second"></div> 

CSS：

#first{ 
    position:absolute; 
    width:100%; height:100%; 
    background:blue; 
} 
#second{ 
    position:absolute; 
    top:100%; 
    width:100%; height:100%; 
    background:yellow; 
} 

Answer 1

使用滚动事件http://api.jquery.com/scroll/ 当事件被触发使用这个插件http://flesler.blogspot.com/2007/10/jqueryscrollto.html

Answer 2

正如@thecodedestroyer说，你可以使用滚动事件做这样的事情：

var currentDiv = "#first"; 
var divArray = ["#first", "#second", "#third", "#fourth"]; 

$(window).on("scroll", function (e) { 
    var ix = divArray.indexOf(currentDiv); 
    if (ix >= 0) { 
     if (window.pageYOffset > $(currentDiv).offset().top) { 
      currentDiv = divArray[(ix + 1) % currentDiv.length]; 
     } else if (window.pageYOffset < $(currentDiv).offset().top) { 
      currentDiv = divArray[(ix - 1) % currentDiv.length]; 
     } 
     $("body, html").animate({ 
      scrollTop: $(currentDiv).offset().top 
     }, 0); 
     e.preventDefault(); 
     return false; 
    } 
}); 

这里测试： http://jsfiddle.net/cxJQE/