Jquery 固定元件的设置高度

我正在处理一个破坏默认页面功能的页面。它的工作原理如下：

一旦你第一次开始滚动页面，一个类似于闪屏的屏幕就会消失，而背景和闪屏是固定的，一旦你翻动了2400px的东西，滚动开始正常运行。这就是我正在研究的解决方案：

<div class="wrapper">
   </p>Rest of the content</p>
</div>
<div class="splash" >
   <p>Splash-content that has 100% height and width</p>
</div>

固定css： .固定{ 位置：固定； 排名：0； 宽度：100%； 边际上限：0； }

---

这种方法效果很好。唯一的问题是，当我将包装设置为“固定”时，它失去了高度。这反过来又使滚动变得不可能。我希望文档根据.wrapper的内容扩展窗口大小。或任何其他实现类似目标的解决方案。Css是首选，但javascript也不错

如果将其设置为

位置：绝对，并且它没有应该修复它的非静态定位父级。正如您所注意到的，固定元素不会影响文档的高度，而绝对元素会影响文档的高度

如果需要的话，将主体高度设置为包装高度将提供固定位置的滚动行为


css

可能是重复的：（第一次在google中找到：css动态大小的固定元素）我不使用position:absolute，而是static。我会去调查那个问题，但我觉得这对我没什么帮助，谢谢你！我创建了一个新的问题，希望它在没有所有背景信息的情况下更清晰一些，这些背景信息并不是真正相关的：如果我没有弄错的话，Absolute和fixed对于Size具有相同的行为。如果您也为类“fixed”提供css，这将是很有帮助的。。。我正在努力实现固定位置行为。使用这种方法，当我滚动页面时，元素不是固定的……我想我不理解这些要求。如果包装器有固定的行为，但是内容比屏幕长，那么您将永远看不到其余的内容，对吗？或者你想让所有的东西都保持在原地直到你到达一段距离吗？是的，没错！当我开始滚动屏幕时，屏幕上发生了一些其他事情，但过了一段时间，我希望它返回到默认行为：）我现在看到的方法是使用javascript获取contaning元素的高度，然后将主体设置为我看不见的高度？哪里
$(document).scroll(function(){
    var scrolllength = parseInt($(window).scrollTop());
    switch(true) {


        //y2004 starts to show
        case (scrolllength > y2004):
            console.log('above 2004 bottom')
            $('.wrapper').removeClass('fixed');
            break;


        //y2003 is fully visible
        case (scrolllength > y2003bottom):
            console.log('below 2003 bottom')
            $('.wrapper').addClass('fixed')

            $('.splash').css('display','none');
            $('.text').fadeIn('fast');

            break;

        //scrolling up, splash starts to show again
        case (scrolllength < y2003bottom && scrolllength > 0):
            console.log('above 2003 bottom '+scrolllength)
            var splashopacity = ((y2003bottom -scrolllength)/y2003bottom );
            $(".splash").css('opacity',(splashopacity));
            //show the splash again
            $('.splash').css('display', 'block');
            $('.text').fadeOut('fast');
            break;


        //default
        default:
            console.log(scrolllength);
            return;
    }
});

<div class='wrapper'>click me</div>

$('.wrapper').on( 'click', function() {
    $(this).toggleClass('fixed');
});

$('body').height( $('.wrapper').height() );

.wrapper {
    height: 2000px;
    width: 100%;
    position: absolute;
    top: 0

    background-color: #e0e0e0;
}

.wrapper.fixed {
    position: fixed;
}