Прокрутка фонового изображения для сброса, когда position = height JQuery

Question

Я пытаюсь создать анимацию jQuery, которая прокручивает фоновое изображение до тех пор, пока оно не дойдет до конца изображения, а затем снова запустится.

Мне удалось получить прокрутку, работающую &, рассчитанную высоту фонового изображения путем смешивания различного кода отсюда, но когда я пытаюсь объединить два, он перестает работать.

Я не слишком семья с javascript, так что не знаю, что происходит!

код ниже:

<div class="animateIcon"> 
    <img src="images/spacer.png" width="144" height="167" class="animation" /> 
</div> 

JQuery

$(document).ready(function() { 

var scrollSpeed = 100; 
var current = 0; 
var step = 167; // How many pixels to move per step 
var direction = 'v';// set the direction 

$.fn.getBgImage = function (callback) { 
    var height = 0; 
    var path = $(this).css('background-image').replace('url', '').replace('(', '').replace(')', '').replace('"', '').replace('"', ''); 
    var tempImg = $('<img />'); 
    tempImg.hide(); //hide image 
    tempImg.bind('load', callback); 
    $('body').append(tempImg); // add to DOM before </body> 
    tempImg.attr('src', path); 
    $('#tempImg').remove(); //remove from DOM 
}; 

$(".animation").getBgImage(function() { 

    var restartPosition = -($(this).height()); 

}); 

function bgscroll() { 

    //Go to next pixel row. 

    current -= step; 



    //If at the end of the image, then go to the top. 

    if (current <= restartPosition) { 

     current = 0; 

    } 

    // move the background with backgrond-position css properties 
    $('.animation').css("background-position", (direction == 'v') ? "0 " + current + "px" : current + "px 0"); 

} 

//Calls the scrolling function repeatedly 
setInterval(bgscroll, scrollSpeed); 

}); 

Оказывается, перерыв, когда я добавить этот код, но не может понять, почему:

 //If at the end of the image, then go to the top. 

    if (current <= restartPosition) { 

     current = 0; 

    } 

Любая помощь приветствуется !

Answer 1

Я еще не пробовал использовать код, но он выглядит как restartPosition нет в том же объеме, что и bgscroll.

Попробуйте добавить var restartPosition; в верхней части с вашими другими глобальными переменными, и изменить var restartPosition = -($(this).height()); к restartPosition = -($(this).height());