模拟单击的选项卡以在jquery中创建选项卡的幻灯片显示 [英] emulating tabs being clicked to create a slideshow of tabs in jquery

问题描述

我下面有一个运行良好的标签系统...但是我希望它开始模仿有人点击它，有效地创建从llist到另一个的幻灯片显示...

I have this nicely working tab system below...but i would like it to start emulating someone clicking on it, effectively creating a slideshow from on llist to another...

//Homepage Tabs  
$('#lcontent .tab:first').show();   
$('#llist li').click(function() {
    var thisTop = $(this).position().top;
    $('.pointer').animate( {'top': thisTop} );
    $('#llist li').removeClass('current');
    $(this).addClass('current');
    var id = $("li.current a").attr('href');
    $("#lcontent div").fadeOut(500).hide();   
    $(id).fadeIn();   
return false;
});

HTML for list:

HTML for list:

<ul id="llist">
   <li class="t current"><a href="#sagesolutions"><span>sage solutions</span></a><img width="24" height="70" class="pointer" title="pointer" src="assets/site_images/bg-tab-leader-arrow.png"></li>
   <li class="m"><a href="#creditmanagement"><span>credit mangement solutions</span></a></li>
   <li class="b"><a href="#thirdparty"><span>third party additions</span></a></li>

内容标签

<div id="lcontent">
  <div class="tab" id="sagesolutions" style="display: block;">
    <h2>sage solutions</h2>
    Sage content
    <hr>
    <a class="btn-solutionstart" href="solutions/sage/which-sage">
    <p>Unsure which solution is best for your business?<br>
      <span>Use our step-by-step guide...</span></p>
    </a> </div>
  <div class="tab" id="creditmanagement">
    <h2>credit management solutions</h2>
    Credit content </div>
  <div class="tab" id="thirdparty">
    <h2>third party additions</h2>
    Third party content </div>
</div>

推荐答案

setInterval((function(){
  var count = 0;
  var ul = $('#llist li');

  return function(){
    ul.eq(++count % ul.length).click();
  };
})(), 2000);

这篇关于模拟单击的选项卡以在jquery中创建选项卡的幻灯片显示的文章就介绍到这了，希望我们推荐的答案对大家有所帮助，也希望大家多多支持IT屋！