Parallax-style 滚动一张 non-background 图片
Parallax-style scrolling of one non-background image
如果没有视觉效果，这可能很难解释，但可以这样说：想象一个 'normal' 网页 - 没什么特别的。现在想象一个主图像位于 header 正下方。成像此图像仅在其容器中显示其高度的一半。现在想象向下滚动页面 - 当您这样做时，主图像以视差样式滚动，在容器内移动，露出另一半。
我找不到这方面的示例，因为我找到的所有内容都使用背景图像或其他图像和在图像顶部移动的元素。我只希望一个元素（主图像）看起来有一些透视。谁能给我举个例子？
为此，您可以使用背景图片和其上方的另一个 div 来显示内容。
你可以使用 bootstrap 视差效果，比如找一个例子 here
不明白为什么不要背景图片，但是在所有情况下，您可以使用Parallax.js，它使用属性data-image-src来指定图像。
看看这个演示：
HTML:
<div class="demo" data-parallax="scroll" data-image-src="/path/to/image.jpg"></div>
jQuery:
$('.demo').parallax({imageSrc: '/path/to/image.jpg'});
（我知道这是一个老话题，但我想解释一种可能性来做 OP 想要的）。
我目前正在寻找完全相同的东西，因为我想使用 <picture> 标签通过 srcset 和媒体查询调用我的图像，从而在不同的设备尺寸上提供不同的图像。
不过看起来不太可能。
如果没有视觉效果，这可能很难解释，但可以这样说：想象一个 'normal' 网页 - 没什么特别的。现在想象一个主图像位于 header 正下方。成像此图像仅在其容器中显示其高度的一半。现在想象向下滚动页面 - 当您这样做时，主图像以视差样式滚动，在容器内移动，露出另一半。
我找不到这方面的示例，因为我找到的所有内容都使用背景图像或其他图像和在图像顶部移动的元素。我只希望一个元素（主图像）看起来有一些透视。谁能给我举个例子？
为此，您可以使用背景图片和其上方的另一个 div 来显示内容。 你可以使用 bootstrap 视差效果，比如找一个例子 here
不明白为什么不要背景图片，但是在所有情况下，您可以使用Parallax.js，它使用属性data-image-src来指定图像。
看看这个演示：
HTML:
<div class="demo" data-parallax="scroll" data-image-src="/path/to/image.jpg"></div>
jQuery:
$('.demo').parallax({imageSrc: '/path/to/image.jpg'});
（我知道这是一个老话题，但我想解释一种可能性来做 OP 想要的）。
我目前正在寻找完全相同的东西，因为我想使用 <picture> 标签通过 srcset 和媒体查询调用我的图像，从而在不同的设备尺寸上提供不同的图像。
不过看起来不太可能。