jQuery - 如何在不点击的情况下为点击功能设置动画（幻灯片放映） - 这可能吗？答案

【问题标题】：jQuery - How to animate click function without clicking (Slide-show like) - Is this possible?jQuery - 如何在不点击的情况下为点击功能设置动画（幻灯片放映） - 这可能吗？
【发布时间】：2010-03-17 13:42:20
【问题描述】：

我创建了一个 jQuery 脚本（在帮助下），效果很好，但是我需要它在不使用点击功能的情况下自动/动画化，我只是想知道这是否可能，如果可以，如何？类似于幻灯片。

基本上，该代码允许我单击图像并隐藏/显示 DIV，同时更改元素列表，例如类/ID 名称。

这是我的代码：

JQUERY：

jQuery(document).ready(function(){
    //if this is not the first tab, hide it
    jQuery(".imgs:not(:first)").hide();
    //to fix u know who
    jQuery(".imgs:first").show();
    //when we click one of the tabs
    jQuery(".img_selection a").click(function(){
        //get the ID of the element we need to show
        stringref = jQuery(this).attr("href").split('#')[1];

        // adjust css on tabs to show active tab
        $('.img_selection a').removeAttr('id'); // remove all ids
        $(this).attr('id', this.className + "_on") // create class+_on as this id.
        //hide the tabs that doesn't match the ID
        jQuery('.imgs:not(#'+stringref+')').hide();
        //fix
        if (jQuery.browser.msie && jQuery.browser.version.substr(0,3) == "6.0") {
            jQuery('.imgs#' + stringref).show();
        } else
            //display our tab fading it in
            jQuery('.imgs#' + stringref).show();
        //stay with me
        return false;
    });
});

【问题讨论】：

我完全不明白你的问题是什么......如果你想自动调用它，只需在文档准备好或使用 setTimeout 时调用它？
我对这一切都是新手，所以我不太确定该怎么做，还有洞察力吗？我很想得到帮助！

标签： jquery automation jquery-animate slideshow

【解决方案1】：

应该这样做。它获取所有“标签”并以循环顺序单击即时消息，每次单击之间暂停 2 秒（2000 毫秒）

var tabs = jQuery(".img_selection a");
var len = tabs.size();
var index = 1;
function automate() {
    tabs.eq((index%len)).trigger('click');
    index++;
}
var robot = setInterval(automate, 2000);

//if at some point you want to stop the automation just call
clearInterval(robot);

做了一个演示

http://jsbin.com/urulo/2/（代码为http://jsbin.com/urulo/2/edit）

【讨论】：

@jitter：我将它添加到我的代码中，但它不起作用，我可能将它放在错误的位置。有任何想法吗？抱歉，我绝对是 jquery/js 的初学者。
检查扩展答案中的链接。为您制作了一个演示并优化了您的代码
这很好用，但我只看到一个问题。因为它在 tab1 上加载，所以动画从 tab1 开始，所以它加载了两次。有没有办法让动画从 tab2 开始？所以在页面加载它加载1，然后它动画到选项卡2？
另外，当我单击其中一个选项卡时，如何停止动画？那可能吗？抱歉所有问题，我已经尝试了很多东西，但它们不起作用，所以我在问。 :) 感谢您的所有帮助，非常感谢。
第一个问题。只需将var index=0; 更改为var index=1;

【解决方案2】：

Time-limiting a function execution is not possible in Javascript.

但是，HTML5 带来了 web-workers，它们基本上是后台 worker 线程。一段时间后可以suspend一个网络工作者。

【讨论】：