如何使用jquery工具幻灯片插件为标签自动旋转和同步导航按钮?

时间:2012-07-20 04:50:22

标签: slideshow jquery-tools flowplayer jquery-tabs

使用来自flowplayer.org的jQuery工具我不明白如何让每张幻灯片自动旋转和同步导航点?

我正在使用幻灯片插件来显示标签以显示大量信息。手动点击幻灯片可以很好地工作,但是想让它们自动旋转。

尝试做了链接插件,但似乎没有这么热。

    <!-- START SLIDE GROUP CONTAINER -->
    <div class="slide_group" id="slide_group_queue_service">

      <!-- container for the slides -->
      <div class="images" id="chained">

        <!-- first slide -->
        <div>info in here</div>

        <!-- second slide -->
        <div>info in here</div>

        <!-- third slide -->
        <div>info in here</div>

      </div>

      <!-- the tabs -->
      <div class="slidetabs">
        <a href="#"></a>
        <a href="#"></a>
        <a href="#"></a>
      </div>

    </div>
    <!-- END SLIDE GROUP CONTAINER -->


    <!-- SLIDE TABS FOR BUSINESSES PAGE -->
    <script type="text/javascript">
    $(function() {
    $(".slidetabs").tabs(".images > div", {

    // enable "cross-fading" effect
    effect: 'fade',
    fadeOutSpeed: "slow",

    // start from the beginning after the last tab
    rotate: true

    // use the slideshow plugin. It accepts its own configuration
    }).slideshow();
    });

    $("#chained").scrollable({circular: true, mousewheel:true}).navigator().autoscroll({
interval: 3000
    });
    </script>

1 个答案:

答案 0 :(得分:0)

想通了。我真的只是使用了一个略有不同的格式化版本位于: http://www.jquerytools.org/

使用滑动标签不是最好的选择。相同的HTML结构,但JS触发它,它的CSS更具体。