带有图像的文本循环 div

Question

我正在尝试将我的图片幻灯片与他们的文本块同步。我发现 Cycle 2 是一个很棒的 jQuery 插件，一个简单的代码让我走得很远。然而，有一个问题。每当文本第一次滑动时，过渡非常糟糕。当前和下一个块的字母“变形”一秒钟。在第一个循环之后，一切正常。

这是循环代码：

$("#slideshow").cycle({
timeout:0, // no autoplay
fx: 'scrollHorz',
randomizeEffects: false, 
next: '#next',
prev: '#prev',
});

$("#text").cycle({
timeout:0, // no autoplay
fx: 'scrollHorz',
next: '#next',
prev: '#prev',
});

你可以看到这个小提琴中的所有内容：http://jsfiddle.net/lucb792/85TCZ/1/（只需单击左箭头或右箭头）

这是可以解决的问题，还是我需要寻找其他解决方案才能做出这样的事情？

Answer 1

在您第一次使用 prev/next 控件时，该插件似乎正在更改文本的宽度。不要将宽度设置为#text，而是将宽度设置为#text 幻灯片中的divs。将 CSS 更改为此为我修复了它：

#text div{
    width:600px;
}

这里是小提琴：http://jsfiddle.net/bbernar1/85TCZ/3/