纯CSS视差-滚动后隐藏在视差图片下的文本

文章/答案/技术大牛

发布

1回答

css、parallax

我正在尝试使这个视差效果的文本不像效果那样向下滚动。我相信这与html CSS代码(Overflow)有关，我试着放入不同的地方，但不起作用。有没有办法让我的视差像现在这样工作，当你向下滚动时，文本仍然是完全可见的？因为只要你向下滚动视差，文本也会滚动，但当你到达文本时，一些已经向上滚动了。

浏览 12提问于2018-08-22得票数 1

2回答

具有视差背景的多平台网站

javascript、html

我有一个具有轻微动画(视差)背景的网站的请求。完全支持IE8。如果可能的话，还要支持平板电脑(比如iPads和安卓平板电脑)。选择其中的两个，这将是很容易做的，但试图涵盖所有三个是有点令人望而生畏的……有没有人知道哪种语言/技术可以涵盖这三种请求？

浏览 4提问于2012-08-08得票数 0

回答已采纳

1回答

在div水平滚动时暂停垂直滚动，在水平滚动的末尾继续垂直滚动

jquery、css、scroll、parallax、horizontalscrollview

有一组图像垂直堆叠在具有overflow-y: auto的<div class="container">中。在第一张图片之后，有一个<div class="info">，它包含一些比父div更宽的文本，需要水平滚动(``overflow x: auto')。这个想法是让container垂直滚动，直到info点击container顶部边缘。此时垂直滚动停止，info开始水平滚动。

浏览 1提问于2018-11-20得票数 0

2回答

如何在Google的收件箱页面中重新创建页面滚动行为？

javascript、html、css、scroll

我试图实现的是，当用户使用鼠标滚轮滚动页面时(因为没有滚动条)，页面会随着动画向下滑动到页面的下一部分，而当动画正在播放时，鼠标滚轮不会工作(整理东西，这是一个很好的行为)。我想要的行为可以在或中看到。我在谷歌的收件箱网站上喜欢的一件事是，它与触摸屏设备及其滚动机制具有相同的效果。我只需要一些关于在这种滚动中发生的事件以及如何管理它们的指针(特别是，我希望通过触摸设备实现相同<e

浏览 0提问于2014-12-13得票数 4

1回答

水平滚动w/视差效应纯CSS

css、scroll、parallax

首先，我是一个完全的初学者，我想我正在努力做得比我的水平更高。所以我的问题是:我实际上是用纯CSS制作了一个水平滚动网站，里面有一些视差。而我已经设法让一些东西发挥作用了。视差效应让我发疯了。在我的模板的第二张幻灯片上，我无法使我的背景粘在我的div内的顶部，它向下滚动是因为原因。另外，我在上面做了一个背景剪辑的文本<

浏览 4提问于2021-12-10得票数 0

3回答

如何删除没有必要的空白

html、css、parallax、removing-whitespace

我遵循了一个使用纯CSS (link：)的视差滚动教程，它似乎在实现后完全工作。问题是，在我的站点标题/导航和身体之间有一个空白，我不知道如何删除。链接在这里；我将站点标题的背景色改为红色，以使其更加可见：。有什么原因吗？提前感谢！

浏览 2提问于2016-03-09得票数 0

回答已采纳

1回答

火车头滚动水平滚动-加载文档时，视差元素的位置不正确

javascript、html、css

我目前正在建立一个水平滚动网站的过程中，我正在使用火车头滚动作为滚动库。页面相当简单:背景上只有几行文本和一些视差图像。但是，当页面加载时，图像似乎不在正确的位置。当用户滚动时，它们会比正常显示的时间早得多，并且突然移动到正确的位置。只有当用户滚动整个页面后，元素才会移动到正确的位置。将视差元素的位置CSS

浏览 35提问于2021-03-31得票数 0

回答已采纳

1回答

纯CSS视差与实际互动内容为“背景”？

css、parallax、interactive

我需要达到一个视差效果，当各种东西是“背景”层，如视频，画布或其他互动的东西，而墙文本滚动，当这些文本“结束”，我需要能够滚动到下一个幻灯片，再次持有任何数量的东西作为它的‘背景’。请参阅获得一个简单的参考(笑脸=交互式内容，矩形=墙的文本)。这就是我能用纯CSS做的事情吗？或者，为了达到这个效果，我是否需要求助于像ScrollMagic这样<

浏览 2提问于2016-12-16得票数 0

回答已采纳

1回答

使用Wordpress的纯CSS视差

css

我想知道是否有可能在不使用Javascript的情况下使用4个重叠的层创建一个纯css，视差效果。当用户向下滚动时，我希望第一个图像与第一个文本块重叠，一旦页面中的间隙再次出现，我希望第二个图像与第一个固定图像重叠。我不能发布所有的代码，但我可以提供一个网址。任何帮助都将不胜感激。

浏览 6提问于2014-09-19得票数 0

1回答

Swift中imageViews视差效果动画的问题

swift、animation、uikit、scrollview、parallax

我试图为滚动视图中的图片创建视差效果动画。其主要思想是打开和关闭限制来实现这一点。一般情况下，一切正常，但滚动后，有时你可以看到一条细线是下一个图像的一部分，或者动画变得非常尖锐，我真的不明白为什么会发生这种情况。我将代码留在GitHub上，您可以运行它并阅读我的注释：

浏览 4提问于2022-07-26得票数 0

回答已采纳

1回答

Jquery mobile阻止$(window).scroll事件触发

javascript、jquery、html、jquery-mobile

我已经包含了一个小脚本，当用户垂直滚动页面时，它会在背景图像上产生视差效果。).offset().top; $('.slider').css('background-position-y当它作为我的自定义脚本的一部分加载时，它什么也不做。它位于我的main.js文件的末尾，这是我的超文本标记语言中引

浏览 0提问于2014-09-03得票数 3

1回答

将css渐变蒙版图像与3d变换一起使用时出现毛刺

css、webkit、css-transforms

我使用的是基于Keith Clark的教程的纯css视差，它使用3d变换。transform: translate3d(0, 0, -30px) scale(1.31); 此外，我使用css梯度蒙版图像与径向梯度层是视差。在一些浏览器中，我看到了可怕的小故障。最大的问题是出现的故障是不确定的。我注意到，当我的计算机CPU/GPU加载时，出现这种故障<e

浏览 0提问于2017-10-03得票数 7

1回答

我可以有一个包含视差图像的div吗?它还可以向上滚动显示视差图像

javascript、css、parallax

在视频中，背景图像似乎是视差的，因为“透明部分”容器像视差一样滚动经过它。但另一方面，图像本身在标题下滚动。我一直在玩，似乎不能达到这个结果。思考视差如何与背景连接工作:固定，我似乎不能围绕我的大脑如何实现这一点。我的视差图像没有在标题下向上滚动，而是留在原处。到目前为止，我只是在做纯css，不确定是否需要Javascript。我正在寻找一些洞察力，如果这是可能的</em

浏览 17提问于2020-04-21得票数 0

回答已采纳

1回答

iOS上Safari中的视差滚动

javascript、ios、scroll、parallax

据我所知，在滚动时执行JS是不可能的。它所知道的所有工作的iOS视差滚动脚本在js中重新创建本机滚动效果以实现这一点。Iscroll 那么，苹果是如何在自己的网站上做到这一点的呢？当您滚动此页面时，请查看模糊的背景图像。

浏览 1提问于2014-06-05得票数 0

1回答

CSS视差溢出-y:滚动使其消失

html、css、parallax

我成功地制作了纯css视差，这很难！^^要做视差，我们必须做overflow-y : scroll礼仪，以滚动的角度，体面从上到下。问题是，它迫使我在一个丑陋的滚动条，我怎么能删除它？这是我的片段：*{box-sizing: border-box;} margin: 0; perspective: 200px;html>

浏览 1提问于2021-10-17得票数 0

5回答

如何在带有文本的div中创建一个不可见的正方形？

html、css

我需要复制下面的图片。中间的图像是我的背景。在我的第一天，我收到了一些短信。在这个div上，我可能需要另一个div，它用文本隐藏div的一部分，这样我就可以看到页面的背景了。不管怎么说，我可以在CSS的div中间有一个看不见的方块吗？我之所以需要这种行为是因为我使用的是视差滚动效应。

浏览 2提问于2013-08-27得票数 2

回答已采纳

1回答

一个几乎固定的背景图像(滚动n个像素，然后固定)可能吗？

jquery、html、css

终于开始为我的个人域名设计一个网站，我遇到了一个关于我想要使用的背景图片的问题。图像是天际线，但翻转后，建筑物从页面顶部落下。在倒置的天际线下，有一个从天空颜色(在本例中为绿色/黄色/橙色)到白色的渐变。我希望实现一种滚动效果，整个页面开始滚动，直到建筑物在页面上的50%左右(比方说75px)，这时背景变得固定，只有文本(理想情况下包括页眉和正文)滚动

浏览 4提问于2011-07-17得票数 0

2回答

向下滚动页面时向上滑动div以显示其后面的内容

jquery、css、parallax

当您向上滚动到站点顶部时，将出现一个带有背景图像的div，并覆盖整个屏幕。然后当你向下滚动时，它会向上滚动，显示出它背后的内容，这些内容不是向上滚动，而是简单地驻留在它后面。我很难理解这是如何实现的。到目前为止，我已经创建了一个名为.mainContent的相对位置的div，其中包含我的内容，几个段落。我最初的想法是视差，但同时我不希望文本从屏幕底部向上滚

浏览 2提问于2013-07-25得票数 0

1回答

Jquery滑块，用于wordpress，随机，带有特色幻灯片，可编辑

jquery、wordpress、content-management-system、slider

其余的幻灯片需要随机化。我还没有找到一个可以支持一个特色的默认图像，然后随机化其余的。

浏览 3提问于2013-04-19得票数 0

2回答

使HTML响应视口

javascript、jquery、html、css、responsive-design

我已经创建了我的第一个网页，并使用ScrollMagic.js实现了视差/分割滚动从这个答案中，我发现视差在移动视图中通常不起作用。当到达某个视口时，建议禁用视差。正如你在这段代码中看到的，我在屏幕小的时候创建了 (调整浏览器的</

浏览 20提问于2019-07-16得票数 1

点击加载更多