怎么用jQuery实现轮流间隔几秒循环显示？！

RT，我现在有几个<a>元素（数量不限），我需要它们轮流间隔几秒循环显示。用jQ怎么实现，请高手指点！

html代码：
<a href="#">第一条新闻</a>
<a href="#">第二条新闻</a>
<a href="#">第三条动态</a>
……

举报该文章

相关建议推荐于2017-09-12

这我自己写的写的可能不是很好但是经过测试能用给分吧：)

<!DOCTYPE html>
<html>
<head>
<style>
*{padding:0;margin:0;list-style:none;}

</style>
<script src="http://code.jquery.com/jquery-1.10.2.min.js"></script>

</head>
<body>
<a href="#">第一条新闻</a>
<a href="#">第二条新闻</a>
<a href="#">第三条动态</a>

<script>
  $(function(){
    $('a:first').siblings().hide();
    var xunhuan = function(){
      if($('a:visible').next('a').get(0) === undefined){
        $('a:visible').slideUp('slow', function(){
          $('a:first').fadeIn("slow");
        });
      }else{
        $('a:visible').slideUp('slow', function(){
          $(this).next('a').fadeIn("slow");
        });
      }
    }
    var t = setInterval(function(){
      xunhuan();
    }, 1000*2)
  });
</script>

</body>
</html>

我又稍微修改了下代码更少了

<!DOCTYPE html>
<html>
<head>
<style>
*{padding:0;margin:0;list-style:none;}

</style>
<script src="

</head>
<body>
<a href="#">第一条新闻</a>
<a href="#">第二条新闻</a>
<a href="#">第三条动态</a>

<script>
  $(function(){
    $('a:first').siblings().hide();
    setInterval(function(){
      $('a:visible').slideUp('slow', function(){
          $(this).next('a')[0] === undefined ? $('a:first').fadeIn("slow") : $(this).next('a').fadeIn("slow");
      });
    }, 1000*2)
  });
</script>

</body>
</html>

追问

你这段代码是可以的，我试过了！
我改成了fadeOut和fadeIn，感觉效果更佳！
另外，你后面那个1000*2 是控制延迟时间的吧？！

灰常感谢！！！！！

追答

是控制时间的

温馨提示：内容为网友见解，仅供参考

当前网址：https://22.t2y.org/zz/c620xsxtcf0tcis62is.html

其他看法

第1个回答 2013-11-21

说下思路没时间调

定义length= $("a").length;
setInterval(方法a,1000)
方法a 定义个n=0比如定义个显示的div id="displayDIV"
$("#displayDIV").empty();

eval('$("#displayDIV").append($("a:eq('+n+')").html())');
if n为length-1 n=0 else n++

第2个回答 2013-11-21

自己写的，效果不是太好，搜焦点图吧，找到合适的既可以直接用，也可以看代码学习。

相似回答

大家正在搜