Fade幻灯片jquery问题

我已经创建了一个幻灯片，使用jQuery的淡出效果，与幻灯片的问题是如果我添加图像，它显示正常，但如果我添加文字而不是图像，文本反弹底部到顶部，我希望它被固定在上面。其实这个问题很可能是因为我现在做的是，我有六个li我是第一个启用li并且禁用休息，现在我给第一个li第一个li和淡入淡出效果为li，现在由第一个li淡出和下一个li淡入，在那个时候，文本反弹，但我不明白为什么这不会发生与图像，这是我的完整代码。Fade幻灯片jquery问题

可以download full project和查看

目前div包含图像，如果更换与H1元素，你可以看到

来源

2012-04-16 Abbas

使用jQuery.cycle插件。它会使幻灯片**更容易为你，而不是重新发明轮子。 http://jquery.malsup.com/cycle/ – Endophage 2012-04-16 23:03:16

你可以给我任何例子，使用jQuery.cycle，其实我想做一个幻灯片，其中将包含图像和文本，并应该有淡入淡出效果，这个插件是否有能力，你能告诉我一些演示可用，我怎样才能以正确的方式实现这个插件 – Abbas 2012-04-16 23:11:12

查看答案为一个简单的jquery.cycle解决方案 – Endophage 2012-04-16 23:35:17

因此，使用jquery.cycle误输出，设置淡入淡出效果就是这么简单下面。你的HTML应该是这个样子：

<div id="slideshow"> 
    <div class="slide"> 
     <p>Some text</p> 
     <img ... /> 
    </div> 
    <div class="slide"> 
     <p>Some text</p> 
     <img ... /> 
    </div> 
    <!-- more slides ... --> 
</div>

那么你的JavaScript是：

$('#slideshow').cycle({ 
    fx:'fade', 
    slideExpr: '.slide' 
});

的淡入淡出效果（FX）是循环的插件内的标准之一。 slideExpr定义了一个jQuery选择器，用于为幻灯片选择主要（此例为#slideshow）包装器中的幻灯片元素。

来源

2012-04-16 23:34:58 Endophage

Fade幻灯片jquery问题

回答

相关问题