javascript - 带有新 jQuery 的精选 slider

Question

我正在尝试使用新的 jQuery 运行 slider ，因为一些功能(如旋转)已被弃用。上传页面时 slider 工作正常，并且我正在努力从右侧单击的选项卡加载图像。当我单击选项卡时，当前图像和当前事件选项卡将被删除，并且新图像和新事件选项卡将正确加载，而不是我调用 startSlider();再次运行，但我失去了 i 的变量值，所以我的 startSlider();运行时不加载图像和事件选项卡背景。请帮我解决这个问题。这是幻灯片图像:

这是我的 jQuery 代码:

$(function() {

    var count = $(".ui-tabs-nav li").length;
    var slideSpeed = 5000;
    var fadingSpeed = 300;
    var i = 1;
    var $slider = $('#featured');

    var interval;

    function startSlider() {
        interval = setInterval(function() {

            $("#fragment-"+i).fadeOut(fadingSpeed, function() {
                $(this).removeClass("ui-tabs-activated");
                $('#nav-fragment-'+i).removeClass("ui-tabs-active");

                a = i+1;

                if (i == count) {
                    a = 1;
                    i = 0;
            }

            $('#nav-fragment-'+a).addClass("ui-tabs-active");
            $("#fragment-"+a).fadeIn(fadingSpeed, function() {
                $(this).addClass("ui-tabs-activated");
            });

            i++;

            });

        }, slideSpeed); // End setInterval function
    }

    function stopSlider() {
        clearInterval(interval);
    }

    $('.ui-tabs-nav-item > a').click(function(evt){

        evt.preventDefault();
        stopSlider();
        i = $(this).attr('href'); // href's are values from 1, 2, 3, 4, or 5
        var id = $(".ui-tabs-active > a").attr('href');

        $(".ui-tabs-nav li").removeClass("ui-tabs-active"); // This remove current tab background
        $("#fragment-"+id).remove(); // This remove div with current image

        $("#fragment-"+i).fadeIn(fadingSpeed, function() {
            $(this).addClass("ui-tabs-activated"); // Load new image
            $('#nav-fragment-'+i).addClass("ui-tabs-active"); // Set active background
        });
        startSlider(); // Start slider again
    });
    startSlider();
}); // jQuery function

Answer 1

嗯，startslider() 使用变量 i 淡出并删除事件类，使用变量 a 淡入并添加事件类。

单击后，您将使用变量 i 进行淡入淡出并添加事件类。变量i是全局的，所以当你重新启动startslider()时，它将使用该i来淡出。

此外，单击后您将删除一个元素，但在您现在显示的代码中我没有看到任何添加新元素或加载图像的内容。