Question

我想使用Supersized Fullscreen背景Supersized

但是我想只在网站的右半部分使用滑块，而在左侧我想拥有我的内容。当我滚动内容时应移动并保留背景。就像这里：example site

有没有人有想法？

编辑：好吧，我明白了，但我怎么能让图像响应？有可能吗？

Answer 1

.supersized {position:fixed;width:50% top:0;bottom:0;}

Answer 2

如果您使用开发工具进行浏览，您会看到：

#supersized {
    position: fixed;
    right: 0;
    top: 0;
    overflow: hidden;
    z-index: -999;
    height: 100%;
    width: 50%;
}

Answer 3

包含内容的DIV应该有溢出滚动：

<style>
    .content{
        position: absolute;
        left: 0;
        top: 0;
        bottom: 0;
        width: 50%;
        overflow: scroll;
    }
    .the-bg{
        background-image: ...;
        background-size: cover;
        position: absolute;
        left: 50%;
        top: 0;
        bottom: 0;
        width: 50%;
    }
</style>

<div class="content">lorem ipsum</div>
<div class="the-bg"></div>

或者，你可以把正确的一个固定：

<style>
    .content{
        float: left;
        width: 50%;
    }
    .the-bg{
        background-image: ...;
        background-size: cover;
        position: fixed;
        left: 50%;
        top: 0;
        bottom: 0;
        width: 50%;
    }
</style>

<div class="content">lorem ipsum</div>
<div class="the-bg"></div>

超大 - 全屏背景 - 只有一半？

3 个答案: