Проблемы setInterval с Chrome и Firefox - PullRequest
Новая
       16

Проблемы setInterval с Chrome и Firefox

0 голосов
/ 14 февраля 2012

У меня проблема с сайтом, над которым я работаю.Это не только этот сайт, но еще один, который я сделал с помощью слайдера Jquery.Они оба имеют разные плагины.Проблема в том, что когда вы меняете вкладки, ползунок сводит с ума, когда вы возвращаетесь ... особенно в Chrome.сайт http://www.firedogpr.com/index.php. Я читал об этой проблеме, но я не мастер JS, поэтому любая помощь будет принята с благодарностью.

По какой-то причине в настоящее время он вообще не работает в Windows.Я также изучаю это.

Я в основном взял код из http://www.snowdenindustries.com и адаптировал его.вот фрагмент JS, который может быть проблемой 

if ($("#mainSlide").length>0) {
    $("#mainSlide div.slide").hide();
    $("#mainSlideNav li a:first").addClass("cur");
    $("#mainSlide div.slide:first").show();


    $("#mainSlideNav li a").click(function() {
        $("#mainSlideNav li a").removeClass("cur");
        $(this).addClass("cur");
        $("#mainSlide div.slide").removeClass("cur").fadeOut(1200);
        var activeTab = $(this).attr("href");
        $(activeTab).fadeIn(1200).addClass("cur");
        return false;
    });

    function slideTimer() {
        if (!($('#mainSlideNav li a.cur').parent().next().children("a").length>0)) {
            $("#mainSlideNav li a").removeClass("cur");
            $("#mainSlide div.slide").removeClass("cur").fadeOut(1200);
            $("#mainSlideNav li a:first").addClass("cur");
            $("#mainSlide div.slide:first").fadeIn("slow").addClass("cur");
        } else {
            var nextTab = $('#mainSlideNav li a.cur').parent().next().children("a").attr('id');
            var nextDiv = $('#mainSlide div.slide:visible').next().attr('id');
            $("#mainSlide div.slide").removeClass("cur").fadeOut(1200);
            $("#mainSlideNav li a").removeClass("cur");

            $("#"+nextTab).addClass("cur");
            $("#"+nextDiv).fadeIn("slow").addClass("cur");
        }
    }
    var miniCount = setInterval( slideTimer, 5000);
    $("#mainSlideNav li a, #mainHeader").mouseenter( function(){
        clearInterval(miniCount);});
    $("#mainSlideNav,  #mainHeader").mouseleave( function(){
        clearInterval(miniCount);
        miniCount = setInterval(slideTimer, 5000);});
}

1 Ответ

1 голос
/ 14 февраля 2012

В документации jQuery прямо сказано, что не следует использовать API-интерфейсы анимации jQuery (например, fadeIn) из интервального таймера, именно потому, что они используют API-интерфейсы, которые использует jQuery, в фоновых вкладках, поэтому вы в конечном итоге запускаете сразу несколько переходов.

По крайней мере, в старом jQuery, который вы используете; Я считаю, что текущий jQuery решает эту проблему.

...