Javascript 如何在卷轴上浮动div？_Javascript_Jquery

Javascript 如何在卷轴上浮动div？

javascript jquery

Javascript 如何在卷轴上浮动div？,javascript,jquery,Javascript,Jquery,当我滚动时，我尝试浮动2个div，但只在左div的顶部显示右div。你知道怎么解决这个问题吗 HTML <body> <div id="scroller-left">Some controls left</div> <div id="scroller-right">Some controls right</div> </body> JavaScript $(window).load(func

当我滚动时，我尝试浮动2个div，但只在左div的顶部显示右div。你知道怎么解决这个问题吗

HTML

<body>
        <div id="scroller-left">Some controls left</div>
        <div id="scroller-right">Some controls right</div>
</body>

JavaScript

$(window).load(function(){
            $(window).scroll(function(){
                if($(window).scrollTop()>10){
                    $('#scroller-left').css('position', 'fixed');
                    $('#scroller-left').css('top', 0);
                    $('#scroller-right').css('position', 'fixed');
                    $('#scroller-right').css('top', 0);
                } else {
                    $('#scroller-left').css('position', 'relative');
                    $('#scroller-left').css('top', 0);
                    $('#scroller-right').css('position', 'relative');
                    $('#scroller-right').css('top', 0);
                }
            });
        });

Jsfiddle

谢谢。

我认为，在这种情况下，没有必要使用JS解决方案。我的解决方案仅限于CSS：

body {
    height:2000px;
    width: 100%;
    margin:0;
    padding:0;
}

#scroller-left{
    position: fixed;
    left: 0;
    background:#CCC;
}

#scroller-right{
    position: fixed;
    right: 0;
    background:#CCC;
}

不允许在没有代码的情况下发布JSFIDLE链接的机制是有原因的。请在问题中保留问题的示例代码。可以使用JSFIDLE，但不是这样。这很不协调。我必须标记、复制、打开一个新标签并粘贴才能看到您的代码。这是一个好的解决方案。用浮动来实现固定位置，并用javascript来控制它，这太奇怪了。。。。

body {
    height:2000px;
    width: 100%;
    margin:0;
    padding:0;
}

#scroller-left{
    position: fixed;
    left: 0;
    background:#CCC;
}

#scroller-right{
    position: fixed;
    right: 0;
    background:#CCC;
}