Question

我在滚动时尝试浮动2个div但是只显示左侧顶部的右侧div。知道如何解决这个问题吗？

HTML

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

CSS

body{
            height:2000px;
            width: 100%;
            margin:0;
            padding:0;
        }
        #scroller-left{
            float: left;
            background:#CCC;
        }
        #scroller-right{
            float: right;
            background:#CCC;
        }

的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
https://jsfiddle.net/q0fa81hf

谢谢。

Answer 1

我认为，在这种情况下不需要JS解决方案。我的解决方案仅限CSS：

c:\PDW\Logfiles>bs.py
Traceback (most recent call last):
  File "C:\PDW\Logfiles\bs.py", line 10, in <module>
    title.insert_after(meta)
AttributeError: 'NoneType' object has no attribute 'insert_after'

JSFiddle

如何在滚动上浮动div？

1 个答案: