幻灯片中的 jQuery 叠加图像

【问题标题】：jQuery overlay image within slideshow幻灯片中的 jQuery 叠加图像
【发布时间】：2013-01-16 15:46:27
【问题描述】：

我只是想实现一个幻灯片，就像你在 http://www.caffeuno.co.uk/ 上找到的那样

我已经有一个幻灯片，但我需要的是这个网站上显示的功能：

图1，稍等一下，淡入文字，淡入可点击按钮，最多等待3秒，翻转图片 2，稍等片刻，淡入文本，淡入可点击按钮，最多等待 3 秒，翻转图片 3，依此类推。

谁能帮忙复制一下？会很好。感谢您花费时间和建议。

【问题讨论】：

标签： jquery image overlay slideshow clickable

【解决方案1】：

jQuery 的 .animate() 函数可以让您轻松地为图片和文本的淡入淡出制作动画。

$('#image').animate({
    opacity: 1
}, 5000, function() {
    //Done fading, wait 3 seconds and display the next image
    setInterval(displayNextImage,3000);
});

更多信息请参见http://api.jquery.com/animate/。

在使用上述函数将不透明度设置为 1 之前，您可能需要更改包含图像和文本的 div 的 z-index，以便隐藏的（不透明度 0）大于当前图像。

我希望这会有所帮助！

【讨论】：

非常感谢。我明天试试，然后回来。