我有 4 张图像堆叠在一起，如下所示:
我正在努力实现两件事:
当鼠标悬停在背景中的图像上时， 图像应该以淡入淡出的效果出现在前景中。有 每张图片下方还有不同的文字，该文字应该出现在 前景。 (那里不需要褪色)
结果应该是这样的:
每隔 10-15 秒(无需用户输入)，右边的下一张图片应该淡入 自动。
从技术上讲，我考虑过将每个图像和文本放入一个单独的 div 中，并使用 z 顺序。淡入淡出的效果也许可以使用 jquery 来实现，但不幸的是，我以前没有使用过它。
非常感谢任何示例代码、具体帮助或指示。
谢谢!
最佳答案
虽然不可能通过他的z-index来控制一个元素的fade
我们总能欺骗我们的眼睛。
DEMO GALLERY
为了实现这一目标，我们可以做到:
- 在我们的图库中插入一个 DIV 元素，它将获取当前图像的
src属性并将其设置为他的背景图像 - 隐藏当前图片，将DIV定位在这张图片上 .position()
- 淡入/淡出我们的 DIV
- 重置图像可见性
如果您有任何问题，请告诉我，我可以评论我的代码以使我使用的步骤更加清晰。
快乐编码
关于javascript - 更改 div 的 z-index，鼠标悬停时具有淡入淡出效果，我们在Stack Overflow上找到一个类似的问题： https://stackoverflow.com/questions/6916993/