By using this site, you agree to our updated Privacy Policy and our Terms of Use. Manage your Cookies Settings.
432,549 Members | 1,717 Online
Bytes IT Community
+ Ask a Question
Need help? Post your question and get tips & solutions from a community of 432,549 IT Pros & Developers. It's quick & easy.

Two loaders interchanging images

P: 63
Hi guys,

As usual, I've found some code from the net, changed it around, added some things and it works, but not exactly the way that I'd like it to work. I want it to work like the app on mtv.com, where one image remains on the main stage, then another image eases in over the top of the previous image.

Basically, I have two loaders. When the timer ends, the bottom loader assumes the image that was on the stage and the second loader eases in the second image. The problem is that when the timer ends, both images disappear momentarily while the loaders reload with the previous image going to the underneath loader and the new image being eased in with the above loader.

How can avoid the momentary loss of images?

Here's the code:
Expand|Select|Wrap|Line Numbers
  1. // don't worry about this img, it's used for another loader in a different location on stage.
  2. image_loader.contentPath = "someOtherImg.jpg";
  3.  
  4. //images to load 
  5. var pictures:Array= ["img1.jpg", "img2.jpg","img3.jpg","img4.jpg","img5.jpg","img6.jpg"]; 
  6. //image to start on, 0 is the first image in the array 
  7. var myItem:Number =0;
  8. var myFlag:Number =0; // used for distinguishing between the beginning of the array and the end of the array of images, because the loop will reset to myItem to 0 when the loop completes
  9.  
  10.  
  11. //loop variables 
  12. var loopAmount:Number = 5000; 
  13. var endTimer:Number = getTimer()+ loopAmount; 
  14.  
  15. //load first image 
  16. loader.contentPath = pictures[myItem]; 
  17.  
  18. onEnterFrame = loop; 
  19. function loop() { 
  20.     timer = getTimer(); 
  21.  
  22.     if (timer >= endTimer) 
  23.     { 
  24.         if (myItem < (pictures.length-1)) 
  25.         { 
  26.             myItem++;
  27.             myFlag=0;
  28.         }
  29.         else 
  30.         { 
  31.             myItem=0;
  32.             myFlag=1;
  33.         } 
  34.  
  35.         loader.contentPath = pictures[myItem];
  36.                 // myFlag let's me know that we are at the beginning of the pictures array
  37.         if(myItem==0 && (myFlag==0))
  38.         {
  39.             loader2.contentPath = pictures[myItem];
  40.         }
  41.                 // myFlag let's me know that we are at the end of the pictures array and to load the last image in the underneath loader
  42.         else if(myItem==0 && (myFlag==1))
  43.         {
  44.             loader2.contentPath = pictures[5];
  45.         }
  46.         else
  47.         {
  48.             loader2.contentPath = pictures[myItem-1];
  49.         }
  50.  
  51.         easeType = mx.transitions.easing.Regular.easeOut;
  52.  
  53.         var begin = 660;
  54.         var end = 10;
  55.         var time = 1.5;
  56.         var mc = loader;
  57.         ballTween = new mx.transitions.Tween(mc, "_x", easeType, begin, end, time, true);
  58.  
  59.                // my feeble attempt at synchronizing the transitions to allow the underneath loader to remain a little longer than the above loader
  60.         /* easeType2 = mx.transitions.easing.Regular.easeIn;
  61.         var begin2 = 10;
  62.         var end2 = 10;
  63.         var time2 = 0;
  64.         var mc2 = loader2;
  65.         ballTween2 = new mx.transitions.Tween(mc2, "_x", easeType2, begin2, end2, time2, true); */
  66.  
  67.             endTimer = getTimer()+ loopAmount;
  68.     }
  69. }
  70.  
I've tried two separate loops as well, in the attempt to have the underneath loader remain visible while the above loader changed images.

Any help is appreciated as usual and thanks in advance :-)
May 16 '08 #1
Share this Question
Share on Google+
1 Reply


P: 63
The solution was for me to create an image that was 4000 px wide, which would be in the underneath loader, followed by having it move the exact width of each individual image, plus 10 px before the image in the above loader would be loaded.

I know crude, but simple.

Getting ready to post another question in regards to stopping the loop in the onEnterFrame.
May 19 '08 #2

Post your reply

Sign in to post your reply or Sign up for a free account.