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"));
}

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

3 个答案: