parallax 相关问题

当从不同位置观看时导致物体的位置或方向看起来改变的效果，例如通过取景器和相机的镜头

j'ai fait un front-end rien de spécial il y'a que le et des éléments dans qui ont une petite Animation lors duscroll et j'ai tout Mis dans la fonction app(), mais si j'enlève留置权代码

reactjs jsx parallax parallax.js

回答 1 投票 0

如何通过滚动时移动背景图像层来创建 3D 幻觉（视差效果）？

我在标题中将两个图像堆叠在一起。当用户滚动时，我的目标是在背景图像中创建微妙的垂直移动，以实现 3D 幻觉。两张图片都有...

javascript html css 3d parallax

回答 1 投票 0

如果父级隐藏溢出，为什么 tranlateZ() 属性不起作用

我正在尝试在应用透视并保留 3-d 后应用translateZ 但没有应用在我的容器上；这是 HTML 代码我尝试在应用透视并保留 3-d 后应用translateZ 但没有应用在我的容器上；这是 HTML 代码 <div class="wrapper"> <div class="container"> <div class="box"> </div> </div> </div> 这是CSS .wrapper { height: 100vw; width: 100vh; perspective: 10px; } .container { width: 80%; height: 79%; transform-style: preserve-3d; overflow:hidden; } .box{ height: 40%; width:30%; margin:20px; background-color: green; transform:translateZ(-33px); } 注释溢出属性后， tranlateZ 工作正常如果我尝试使用溢出-x 或溢出-y，也会出现同样的问题；为什么会出现这种情况。有什么办法解决吗？您必须将视角移动到 .container 元素。使用overflow: hidden可以防止透视效果的“传播” .wrapper { height: 100vw; width: 100vh; } .container { width: 80%; height: 79%; transform-style: preserve-3d; overflow:hidden; perspective: 10px; } .box{ height: 40%; width:30%; margin:20px; background-color: green; transform:translateZ(-33px); } <div class="wrapper"> <div class="container"> <div class="box"> </div> </div> </div> 您面临的问题与溢出属性有关。当您在.container元素上设置overflow:hidden时，它会创建一个新的堆叠上下文，这会影响translateZ属性应用于其子元素的方式。当您使用overflow:hidden时，.container元素将成为其子元素的新容器，并且translateZ将相对于该新容器的位置应用。这可能会导致 3D 转换出现意外行为。要解决此问题，您可以将溢出：隐藏属性应用于包装元素而不是 .container 元素。

html css overflow parallax perspective

回答 2 投票 0

横竖混合滚动

你好，我的网站遇到了一个问题，我希望用户通常垂直滚动，但是当他到达那个特定的容器时，它会水平滚动，直到容器在我的水平线上……

html css reactjs parallax horizontal-scrolling

回答 0 投票 0

滚动后如何在 collectionView 单元格中居中微调样式的卡片视图？

我有一个像视差一样滚动的 collectionView，但它的活动可见单元格位于上一个和下一个单元格的顶部。但是，问题是当我从第一个单元格（黑色）向左/向右滚动时

ios swift parallax uicollectionviewlayout

回答 1 投票 0

对象实例化不按预期方式工作

我正在开发一个无限滚动条，其中玩家和相机是静止的，而平台和背景向它们移动。一旦一个物体第一次进入相机，它就会产生……