滾動％屏幕

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/