Bootstrap 词缀跳跃

Question

我希望在页面滚动时将图像贴在右侧，并且我已经确定了此过程的引导词缀

http://jsfiddle.net/7rhdLcz7/

$(function () {

    $('#image').affix({
        offset: {
            top: 200,
            bottom: 200
        }
    });
});

我遇到的唯一问题是图像在滚动过程中跳到屏幕中心，然后在底部弹回原位 - 有解决办法吗？ 包括一个演示 jsfiddle 的链接。

Answer 1

您要求将图像固定在距顶部 200 像素和距底部 200 像素之间。

如果您希望图像保持在右下角，请使用#image css

例如：

JS

$(function () {
    $('#nav-wrapper').height($("#nav").height());

    $('#nav').affix({
        offset: {
            top: $('#nav').offset().top
        }
    });

    $('#image').affix({
        offset: {
            top: 200
        }
    });
});

CSS

#image {
    top:0;
    bottom: 200px;
    right:0;
}

#nav.affix {
    position: fixed;
    top: 0;
    width: 100%
}
#nav > .navbar-inner {
    border-left: 0;
    border-right: 0;
    border-radius: 0;
    -webkit-border-radius: 0;
    -moz-border-radius: 0;
    -o-border-radius: 0;
}