Проблемы с jQuery setInterval ()? - PullRequest
Новая
       11

Проблемы с jQuery setInterval ()?

0 голосов
/ 10 ноября 2011

У меня есть слайдер изображений, созданный с помощью jQuery.Это установлено, чтобы скользить изображения с интервалом в 7000 миллисекунд.Иногда, и только иногда, кажется, что слайдер будет скользить изображения на гиперскорости (интервал между слайдами около 1 секунды).Я не могу определить причину.Пожалуйста, помогите!

Ссылка на сайт со слайдером: http://healthyhometech.com

    function slider() {
        $(".paging").hide();
        $(".paging a:first").addClass("active");

        var imageWidth = $(".window").width();
        var imageSum = $(".image_reel img").size();
        var imageReelWidth = imageWidth * imageSum;

        $(".image_reel").css({'width' : imageReelWidth});

        rotate = function(){
            var triggerID = $active.attr("rel") - 1; 
            var image_reelPosition = triggerID * imageWidth; 

            $(".paging a").removeClass('active'); 
            $active.addClass('active'); 

            $(".image_reel").animate({
            left: -image_reelPosition
            }, 500 );

        }; 

        rotateSwitch = function(){
            play = setInterval(function(){ 
             $active = $('.paging a.active').next(); 
                if ( $active.length === 0) { 
                $active = $('.paging a:first'); 
            }

                rotate(); 
            }, 7000); //Timer speed
        };

        rotateSwitch();

        $(".image_reel a").hover(function() {
        clearInterval(play); 
        }, function() {
        rotateSwitch(); 
        }); 


    };

Ответы [ 2 ]

2 голосов
/ 10 ноября 2011

Существует серьезная проблема с setInterval: он остается в памяти!Следовательно, есть вероятность, что вы обновляете страницу во время тестирования и, следовательно, создаете различные setInterval для одной и той же процедуры, поэтому, ИНОГДА, вы видите, что процедура выполняется намного быстрее (на самом деле setInterval происходит несколько раз).

Мне удалось решить аналогичную проблему, используя var "my-interval" = setInterval и перед запуском setInterval проверяя, существует ли она (не ноль).Если это так, убейте его или не запускайте заново: 

var myInterval;
if (myInteval == undefined) myInterval = setInterval(function () {
    ...
    myInterval=12345;
},..);
0 голосов
/ 10 ноября 2011

Попробуйте увеличить значение времени в следующем разделе кода: 

$(".image_reel").animate({
        left: -image_reelPosition
        }, 500 ); //Here increase the value 500 to a value suitable to you, for example 1000, 2000 etc. anything you like.

Значение в миллисекундах определяет скорость анимации.

[EDIT]

Хорошо, из того, что я заметил, я думаю, что проблема быстрого скольжения возникает только тогда, когда вы оставляете веб-страницу открытой на вкладке и продолжаете работать на других вкладках, а затем, когда вы возвращаетесь на вкладку, содержащую страницу, она скользит изображения в быстром темпе. если вы останетесь на вкладке, этого не произойдет. Я предполагаю, что Вы заметили эту проблему в браузере Chrome .

Кажется, в скрипте нет проблем, только то, как работает браузер Chrome. Если вы оставляете вкладку в фоновом режиме, Chrome, вероятно, приостанавливает функцию setInterval () и, когда вы возвращаетесь на страницу, запускает ее в течение периода времени, когда она была в фоновом режиме. Так что, вероятно, именно так работает браузер Chrome. Нет проблем в коде.

...