尋找替代這個WordPress插件「在飛過」

Question

進出口尋找一個jQuery替代這個插件：

「upPrev：紐約時報樣式‘下一篇’動畫按鈕」 http://wordpress.org/extend/plugins/upprev-nytimes-style-next-post-jquery-animated-fly-in-button/

有誰知道如果有這個非WordPress的版本？這將與非蠕蟲網站一起工作。

謝謝！

Answer 1

您可以fiddle with a working demo of the following code here.

這種類型的動畫正是jQuery是建立能夠輕而易舉地完成，所以我不認爲你需要一個插件來實現這一點。比方說你有，你要滑出以下div長HTML頁面：

<div id="botSlide">Hey, look at me!</div> 

你會風格這個div是在靠近頁面底部的固定位置，就在屏幕右側，如下所示：

#botSlide { 
    padding:20px; 
    width:200px; 
    position:fixed; bottom:20px; right:-240px; 
} 

關鍵是綁定窗口的滾動事件，當滾動條超過某個閾值時觸發。下面是實現這一目標的一種方法：

$(window).bind('scroll', function(e) { 
    var buffer = 500, 
     bsPadding = 40, 
     slideIn = ($(this).scrollTop() > 
        ($('body').height() - $(window).height() - buffer)), 
     $bs = $('#botSlide'); 

    if (slideIn) { 
     $bs.not(':animated') 
      .stop(true, false) 
      .animate({ 
       'right': 0 
      }, 300); 
    } else { 
     $bs.not(':animated') 
      .stop(true, false) 
      .animate({ 
       'right': -$bs.width() - bsPadding 
      }, 300); 
    } 
}); 

的.not(':animated')和.stop(true,false)是防止怪癖動畫滾動快時。