Xml slideshow tutorial - fade from image to image?

1

I am building a slideshow for a client based on Kirupa’s fantastic tutorial http://www.kirupa.com/developer/mx2004/xml_slideshow.htm

I want to change it so that instead of new images fading in from the background color, they fade from image to image. To that end, I have created another instance of the image mc the same as “picture” but called “bg_picture”. I have placed it in the same layer as picture, but sent it to the back so it would lie behind the main picture.

My thought was to load the current picture as a background picture before p got incremented (or decremented) and the new image fades in. That way, the fade will be from one image directly to the next. I have edited the code as follows:

function nextImage() {
    if (p<(total-1)) {
        bg_picture.loadMovie(image[p], 1);  //added this line
        p++;
        if (loaded == filesize) {
            picture._alpha = 0;
            picture.loadMovie(image[p], 1);
            desc_txt.text = description[p];
            picture_num();
            slideshow();
        }
    }
}

When I test the flash file, the slideshow performs as expected except that when the new line is called, the image showing blinks out to the background color momentarily, then reappears before the new image fades in.

I thought it might be a question of the background image not being preloaded, so I tried the following code to force the background image to load before the transition starts. Unfortunately, there was no discernable difference in the display.

function nextImage() {
    if (p<(total-1)) {
        bg_picture._alpha = 0;            //added code starts here
        bg_picture.loadMovie(image[p], 1);  
        bg_filesize = bg_picture.getBytesTotal();
        bg_loaded = bg_picture.getBytesLoaded();
        if (bg_loaded == bg_filesize) {
            bg_picture._alpha = 100;        //added code ends here
            p++;
            if (loaded == filesize) {
                picture._alpha = 0;
                picture.loadMovie(image[p], 1);
                desc_txt.text = description[p];
                picture_num();
                slideshow();
            }
        }                                    //added code
    }
}

Does anyone have any idea what I can do to have this transition smoothly?