如何使对称图像相互滚动？答案

【问题标题】：How to make symmetrical images scroll over each other?如何使对称图像相互滚动？
【发布时间】：2013-06-17 16:42:33
【问题描述】：

这很难解释，请查看http://www.adhamdannaway.com。

我想为我的在线作品集创建一个类似的前端，但我找不到任何关于如何使用它的信息。是jquery 还是css？

查看代码时，html 大小会随着图像的移动而变化。我认为这与视差滚动有关。

有人能说明一下情况并指出正确的方向吗？

谢谢。

【问题讨论】：

【解决方案1】：

嗯，第二个链接有两张图片，一张是黑白的，另一张是彩色的。然后使用css位置将两个图像放在另一个之上（现在显示一个图像）。然后使用jquery你可以在图像上做onhover事件 - 改变另一个图像的宽度并只显示块并在悬停时增加宽度.

【讨论】：

【解决方案2】：

效果是parallax。这个example 显示了您可能想要的效果。请注意红色层如何跟随光标而背景图像保持在原位。您需要将背景设置为一个图像，将“红色”图层设置为第二个图像。您还需要将“红色”图层设置为仅在 x 方向上移动。

【讨论】：