寻找替代这个“飞来飞去”的wordpress插件

Question

我正在寻找一个jQuery替代这个插件：

"upPrev: NYTimes Style“下一篇文章”动画按钮“http://wordpress.org/extend/plugins/upprev-nytimes-style-next-post-jquery-animated-fly-in-button/

有没有人知道有没有非wordpress版本？这将适用于非worpress站点。

谢谢!

Answer 1

You can

这种类型的动画正是jQuery构建时要轻松完成的，所以我不认为你需要一个插件来实现这一点。假设您有一个很长的HTML页面，其中包含您想滑出的以下div：

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

您可以将此div设置为页面底部附近的固定位置，并且正好在屏幕右侧，如下所示：

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

关键是绑定窗口的scroll事件，使其在滚动条超过某个阈值时触发。以下是实现这一点的一种方法：

$(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)是为了防止快速滚动时动画中的怪癖。