Bootstrap Affix Jumping About

时间:2014-10-24 15:11:46

标签: jquery twitter-bootstrap affix

我希望图片能够粘贴在右侧,同时页面滚动,我已经确定了这个过程的bootstraps附件

http://jsfiddle.net/7rhdLcz7/

$(function () {

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

我遇到的唯一问题是图像在滚动过程中跳到屏幕中心然后弹回到底部 - 这是否有解决方法? 包括jsfiddle of demo的链接。

1 个答案:

答案 0 :(得分:0)

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

如果您希望图像粘在右下方,请使用#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;
}