问题描述
我正处于编码之旅的开始，所以我必须专门使用HTML和CSS进行当前项目。任务是使用display: flex;和flex-direction: column;创建一个简单的单页网站，并使用CSS进行测试。作为具有足够空闲时间的挑战发烧友，我开始为单页寻呼机添加视差。我没有遗憾-
我认为我已经理解了广泛的界限，但是我还没有完全理解它的深层原理。通过调整this video by Red Stapler中的代码，我设法构建了某种作品。您可以在here on CopePen处找到我的作品。我知道这很丑陋，但我真的很想在对内容进行样式设置之前先学习视差（困难部分在简单部分之前）。
如您所见，如果您签出我的笔，我将原来的background-image注释掉，然后将其替换为linear-gradient。我的background-image的尺寸为1280px * 960px，但我宁愿以200vh的高度显示它。我还考虑过剪切每个article来创建视觉平衡并缩短页面（我最初打算使用200vh的总高度，因此是background-image的尺寸）。
这是我的问题。如何正确校准视差，以使前景高度与背景高度相对应？更具体地说，如何调整滚动速度，以使前景和背景同时到达各自的底部？并与我剪切/取消剪切部分内容的想法兼容（这将导致滚动速度适应于变化的前景高度）？
我感觉这两个属性有一些可尝试之处z-index: -1; transform: translateZ(-1px) scale(2);，因为视频中的那个家伙解释说具有不同索引的元素将以不同的速度滚动，但是我花了最后的时间几个小时在各个方向上搜寻，却找不到答案。或者，也许我读了无数次，但它却让我感到头疼。
解决方法
暂无找到可以解决该程序问题的有效方法，小编努力寻找整理中！
如果你已经找到好的解决方法，欢迎将解决方案带上本链接一起发送给小编。
小编邮箱:dio#foxmail.com (将#修改为@）