setInterval script out of sync with innerFade

I'm creating an ad banner for a client using innerFade plugin for jQuery and some basic Javascripting to move the background image in the CSS. I'm using the setInterval method for the background image but it is getting out of sync with innerFade. Below is the code I have placed in the head of the page. I'm just trying to find an effective and efficient method for syncing the two up.

$(document).ready(function () {
    $('#slides').innerfade({
        animationtype: 'fade',
        speed: 2000,
        timeout: 5000,
        type: 'sequence',
        containerheight: '326px'
    });
});

---

// Code for panning of background images
var scrollSpeed = 48.58;
var step = 1;
var interval = 0;
var secs = 0;
var img1Pos = 0;
var img2Pos = 0;
var img3Pos = 0;

function scrollBg() {
    interval += step;
    secs = (interval / 20);

    while (secs < 1) {
        $(this).hide("slide", {
            direction: "down"
        }, 1000);
        img3Pos -= step;
        $('#image3').css("background-position", "0 " + img3Pos + "px");
        break;
    }
    while (secs < 6) {
        img1Pos -= step;
        $('#image1').css("background-position", "0 " + img1Pos + "px");
  开发者_如何转开发      break;
    }
    while (secs < 11 && secs > 5) {
        img2Pos -= step;
        $('#image2').css("background-position", img2Pos + "px 0");
        break;
    }
    while (secs < 15 && secs > 10) {
        img3Pos -= step;
        $('#image3').css("background-position", "0 " + img3Pos + "px");
        break;
    }
    if (secs == 15) {
        interval = 0;
        img1Pos = 0;
        img2Pos = 0;
    }
    if (secs == 1) {
        img3Pos = 0;
    }
}

var init = setInterval("scrollBg()", scrollSpeed); 

---

I think the problem here is that Javascript is not multi-threaded. You are trying to emulate multi-threading by moving the image bit by bit, but the end result will never be perfectly in sync unless you write your own fade implementation.

Also you could replace while (secs < 6) { .. break; } with if (secs < 6).