jQuery 循环插件，只有一张图片答案

【问题标题】：jQuery cycle plugin with only one imagejQuery 循环插件，只有一张图片
【发布时间】：2011-08-24 08:13:26
【问题描述】：

这是一个有点奇怪的问题，但我正在尝试使用循环插件来仅显示一张图像。那只是为了使用插件提供的各种效果。我有一排带有特定文本的图像，每个图像/文本都将托管在一个 div 标签内，该标签将被循环插件包围。在某些时候，不同的 div 标签会使用插件的循环功能产生一些动画效果。我想我可以添加相同的 div 标签来解决这个问题，但我想知道是否有人知道如何做我想做的事。

【问题讨论】：

标签： javascript jquery jquery-cycle

【解决方案1】：

如果您尝试在具有相同图像但不同文本的 DIV 之间循环，那么是的，您可以这样做。这是一个基本示例。

<script type="text/javascript">
$(document).ready(function() {
    $('.slideshow').cycle({
        fx: 'fade' // choose your transition type, ex: fade, scrollUp, shuffle, etc...
    });
});
</script>

<style type="text/css">
.slideshow { position: relative }
.slideshow div { position: relative; }
.slideshow div span { position: absolute; top: 5px; left: 5px; }
</style>

<div class="slideshow">
    <div>
        <span>Here's some text!</span>
        <img src="http://cloud.github.com/downloads/malsup/cycle/beach1.jpg" width="200" height="200" />
    </div>

    <div>
        <span>Some more different text.</span>
        <img src="http://cloud.github.com/downloads/malsup/cycle/beach1.jpg" width="200" height="200" />
    </div>

    <div>
        <span>Even more different text.</span>
        <img src="http://cloud.github.com/downloads/malsup/cycle/beach1.jpg" width="200" height="200" />
    </div>
</div>

【讨论】：