Question

我有下一期 -

下一个代码显示3个div - 第一个是一个大红色框，位于页面顶部，下面是一个蓝色框。最后一个div显示了＆＃39; info＆＃39;。

现在我想做的是让蓝色框向下滚动，但当红色框不在视线范围内时，它会位于页面顶部，当红色框可以查看时，蓝框将位于它的底部。

另外我想要处理的另一件事是红色框的高度可能是一个不同的值，当我们说这个页面正在重新调整大小时。

所以这是简单的代码 -

        <script>



        $(document).ready(function () {


            var totaltext = "";
            for (var i = 0; i < 100; i++) {
                totaltext += "scroll!<br />";
            }
            $("#div2").html(totaltext);



        });
    </script>

    <style>
        .top_box {
            width: 100%;
            height: 200px;
            background-color: red;
            //position: absolute;
        }

        .scrolling_box {
            width: 100%;
            height: 100px;
            background-color: blue;
            position: fixed;
        }

    </style>

</head>
<body>

    <div class="top_box"></div>
    <div class="scrolling_box"></div>
    <div id="div2"></div>

</body>

知道我该怎么办？感谢您提供任何帮助

CSS / jQuery - 当页面向下滚动时，如何使一个未放置在页面顶部的div位于页面顶部

0 个答案: