-1

我有 3 个部分，想用 jQuery 一个一个地展示它们，但我不知道怎么做？

查询

$infos = $("#ex-2").find('section').hide(),

HTML

<div class="ex">
  <article>
    <section>
      <font style="background-color:#000000"> Lorem ipsum dolor sit amet, consectetur adipisicing elit, sed do eiusmod tempor incididunt ut labore et dolore magna aliqua.
        Ut enim ad minim veniam, quis nostrud exercitation ullamco laboris nisi ut aliquip ex ea commodo consequat.
        Duis aute irure dolor in reprehenderit in voluptate velit esse cillum dolore eu fugiat nulla pariatur. </font>
    </section>
    <section>
      <font style="background-color:#000000"> testing testing </font>
    </section>
    <section>
      <font style="background-color:#000000">testing 2</font>
    </section>
  </article>
</div>

有什么帮助吗？

4

2 回答 2

0

问题不清楚/不完整。通过猜测，我可以建议您使用jQuery Cycle Plugin

添加循环插件后，您只需简单地调用它：

$(document).ready(function(){
  $('article').cycle({
    fx: 'fade' // choose your transition type, ex: fade, scrollUp, shuffle, etc...
  });
})
于 2012-10-09T05:21:51.770 回答
0

好吧，首先你的容器 div 有一个类，而不是一个 id，所以你需要使用".ex"not进行选择"#ex-2"。然后尝试这样的事情：

$(document).ready(function() {
    var $infos = $(".ex").find('section').hide(),
        i = 0;

    function showOneByOne(){
        if (i < $infos.length)
            $infos.eq(i).fadeIn(500, showOneByOne);
        i++;
    }
    showOneByOne();
});

演示：http: //jsfiddle.net/A2Nbu/

如果“一个一个地显示”意味着显示一个，然后隐藏它并显示下一个，并无限期地继续下去，那么对上面的一个小修改就可以做到：

$(document).ready(function() {
    var $infos = $(".ex").find('section').hide(),
        i = 0;

    function showOneByOne(){
        $infos.eq(i).fadeIn(500).fadeOut(100, showOneByOne);
        i = (i + 1) % $infos.length;      
    }
    showOneByOne();
});

演示：http: //jsfiddle.net/A2Nbu/2/

无论哪种方式，想法都是从隐藏的部分开始，并使用索引变量一个一个地循环它们i。

有关我使用的 jQuery 方法的详细信息，请访问jQuery API 参考站点。

于 2012-10-09T05:24:06.593 回答