屏幕上的中心元素，同时保持响应

Question

我正试图找出一种方法来定位棕色V形，使其垂直保持在中心用户滚动时屏幕，但不会切入页眉图像或页脚。

我知道这可以用position: absolute解决，但我想保持Bootstrap的响应能力。我该怎么做呢？

标题

页脚

Answer 1

使用Jquery scrollTop检测您何时位于窗口的顶部或底部，然后在不同的滚动点处为该元素切换不同的css类。

我也认为你正在寻找位置＆＃34;固定＆＃34;而不是＆＃34;绝对＆＃34;。

$(window).scroll(function(){
    if($(window).scrollTop() > 200){
        $('selection').toggleClass("your-class");
    } else {
        $('selection').toggleClass("your-class);
    }
})

.your-class {
    position: relative;
    margin-top: 200px;
}
selection {
    position: fixed;
    margin-top:50%;
}