最简单的图像旋转器，用于四个图像，底部具有链接

Question

我有四张照片。 我希望他们循环旋转。 在图像下方是用于每个图像的文本链接的区域，以查看图像（在动画循环中）。

那里有很多脚本，没有人能完全满足我的需求。

有人可以提出任何建议吗？

非常感谢。

Answer 1

我推荐使用循环插件： http ： //jquery.malsup.com/cycle/

我只将它用于图像，而不是图像和文本链接，但这只是一个开始！

Answer 2

除了jquery循环（我强烈推荐）之外，还有一个真正被剥离的InnerFade： http ：//medienfreunde.com/lab/innerfade/

但在任何情况下，你都需要围绕图像的结构化html。 所以这样的事情

<ul class="rotate-this">
    <li><img src="foo.jpg"></li>
    <li><img src="bar.jpg"></li>
    <li><img src="foobar.jpg"></li>
</ul>

你会像这样调用它：

$('ul.rotate-this').cycle({ // or $('ul.rotate-this').innerfade({
    option: value,
    option: value
});

Answer 3

我将使用循环插件并使用after：回调来加载图像的链接。 我在公司的网站上做了类似的事情。 我没有测试过，但是应该很接近。

$(#imagecontainter).cycle({ after: afterSlide });

function afterSlide( currentSlide, nextSlide, options, forwardFlag) {
    $("#yourLink").attr("href", currentSlide.attr("src"));
    $("#yourLink").text(currentSlide.attr("alt"));
}