Pre-loading external images for XML-based gallery

I'm working-on an XML-based photo gallery here:
http://www.unionandparkwood.com/demo/flash_gallery/
It works how I want it, except that the first time a
thumbnail is clicked for an image, it pauses long enough to skip
the fade. If you click-through the images a second time, you'll see
that it works smoothly. My guess is that the first time the
thumbnail is clicked, the image isn't cached, yet.
I tried to fix this by creating a JavaScript file for the
page to pre-load each image and thumbnail:
0003a = new Image;
0003a.src = "images/Down-Range.jpg";
0003b = new Image;
0003b.src = "thumbnails/Down-Range.jpg";
But that didn't work. What would be the best way to do this?
I included a link to "Download ZIP" of the FLA project on
this page, too, because it wouldn't be easy for me to describe
what's happening. In a nutshell, a thumbnail click launches a
function that loads the appropriate image into the main image
holder. What seems to be happening the first time is the image
isn't loaded before the fade is finished, so the image just appears
after a short pause the first time.

>>What seems to be happening the first time is the
image isn't loaded before
>>the fade is finished, so the image just appears after
a short pause the
>>first time.
As has been said many times in thos forum - use the
MovieClipLoader class to
load images, and then use that class' onLoadInit method to do
things with
the loaded image. Loading is asynchronous - you _have_ to
wait until the
image is done loading before doing a fade.
Dave -
www.offroadfire.com
Head Developer
http://www.blurredistinction.com
Adobe Community Expert
http://www.adobe.com/communities/experts/

Similar Messages

  • Load external images

    Im wanting to make a photo gallery that I can update easy, I
    thought if I could have a movieclip load external images for my
    thumbnails it would be nice but Im not sure how to set it up. I
    would make a file for my images and then another for my thumbnails,
    then if or when I want to switch out pictures I'd just have to drop
    new images into my folders and not even touch the FLA. Could anyone
    point me in the right direction with the right action script to use
    or a tutorial that explains how this is done..
    And when I say load external I want it so I dont have to
    click on the image for it to load, I want it to just load
    automatically , I would put an invisible button or something to
    that efect over the images for a animated effect.
    Thanks for your help.

    I don't know if you are super enthusiastic about building it,
    or if you just want the utility. If the later is the case, I just
    purchased (cheap) a really great product that does all of what you
    want, fairly automatically, including scaling large pictures down
    to smaller size so that they load quickly.
    I am not sure of the policy of recommending third-party
    applicatons here. So, if you are interested, send an email (private
    message) to me and I will show you the simple site I put together
    using it and where to get it.

  • Load external images and video in edge

    Hi.
    I am looking into edge instead of flash.
    My question is how do you load external images and videos from an external server?
    To clarify, I need to insert a link from where the images can load into the stage, so they don´t take up any of the final weight.
    Thanks in advance.
    Best,
    Stig.

    The above solution I provided works if you already have the images in your composition and than if you want form load images from another server rather than the relative location to your html file.
    Now if you want to load images dynamically into a rectagle containter you will have to code it.
    below is a sample for that
    Create a 'rectangle' with name 'Rectagle'.
    Add the snippet in the compositon ready or on other user actiosn based on your requirement
    var myImagetag = '<img src="http://wwwimages.adobe.com/include/style/default/SiteHeader/logo-2x.png">'
    sym.$("Rectangle").append(myImagetag);

  • Load External image

    I'm  trying to load an image for a Photos folder. The photo.swf is in the same file structor as the "photos "folder, using the code below is works great when I open photo.swf and then click the P_002 button. All of this in contained in a folder named "content"
    P_002.onPress = function():Void {
    loadMovie("photos/002.jpg", _root.photo.empty);
    The problem is I have a main menu swf file outside the "Content" folder When I launch the photo.swf form the main menu it will not load the photo.
    I have tried moving the photos folder several places but no help
    I also tried adding content to the path
    P_002.onPress = function():Void {
    loadMovie("content/photos/002.jpg", _root.photo.empty);
    Can someone please help solve this?
    wayne

    Ned thank you for being so patient we me
    I have tried various version of the path but no luck
    The full path when launched from the web is
    http://rsvp.siterender.com/demo/RSVP_admin.swf/demo/RSVP_admin.swf/f1.swf/co
    ntent/photos/001.jpg
    Locally I use the RSVP_admin.swf to launch the program and it works fine
    The f1.swf has the coding in it to view the photos
    Photos_mc.P_001.onPress = function():Void {
    loadMovie("content/photos/001.jpg", _root.photo.empty);
    I'm about to give up on this approach and look into just having the button
    load an image form the library (if I can figure that out)
    If you don't have time to help I understand and appreciate the help you have
    already helped with
    wayne

  • Loading External Images Causes Memory Leak

    I have been working on an Actionscript 2.0 project that basically loads external images.
    Everytime i load and unload a new image, memory increases to 1 or 2 MBs
    If all the images are in cache, then it increased to 4 or 8 KBs
    In the unloading of images, I have removed loader and the container of the image.
    Any thoughts why it is behaving like that?
    Please find the sample code snippet below.
    btn_load.onRelease = function()
    loadImage();
    btn_unLoad.onRelease = function()
    unLoadImage();
    var mcListener:Object = new Object();
    var container1:MovieClip;
    var mcLoader:MovieClipLoader;
    var loader_reference = this;
    var n=0;
    function loadImage(){
    var image_arr = ["http://xyz.com/image1.png","http://xyz.com/image2.png","http://xyz.com/image3.png","http:/ /xyz.com/image4.png","http://xyz.com/image5.png"];
    var image_url = image_arr[n];
    if(n==image_arr.length-1) {
      n=0;
    }else{ 
      n++;
    container1 = loader_reference.createEmptyMovieClip("container1", loader_reference.getNextHighestDepth());
    mcLoader = new MovieClipLoader();
    mcLoader.removeListener(mcListener);
    mcLoader.addListener(mcListener);
    mcListener.onLoadComplete = function(target_mc:MovieClip, httpStatus:Number):Void {
    mcListener.onLoadInit = function(target_mc:MovieClip):Void {
      target_mc._x = 300;
      target_mc._y = 200;
      target_mc._width = 300;
      target_mc._height = 250;
    mcLoader.loadClip(image_url, container1);
    function unLoadImage(){
      mcLoader.unloadClip(container1);
      mcLoader = null;
      container1 = null;
      removeMovieClip(loader_reference.container1);
    Thanks in advance.

    that code should only execute once.  fix that.

  • Quick recovery image for internet based clients

    Hello all,
    Imaging of internet based clients is not supported with SCCM, but is there any other (Microsoft) way to quickly recover to a standard image for internet based clients (we use MS Surface for our sales reps)? For example, putting an standard image on a seperate
    partition with which you can instruct users by phone to redeploy their machine to an original configuration? I do not think that DaRT will solve my issue by the way.

    I haven't implemented this myself. I just thought it was a cool idea. It's primarily designed to solve this problem with very small branch offices using Direct Access. You should contact 1E for more information
    eg the step: "Prestage content using Nomad".
    Where is the content coming from? Remember that this is designed for a small office so Nomad could be using peer-to-peer distribution here. Also, with Nomad, you could run that step outside the OSD task sequence so that the content will already
    be available (by downloading slowly over time) when and if required. 
    Gerry Hampson | Blog:
    www.gerryhampsoncm.blogspot.ie | LinkedIn:
    Gerry Hampson | Twitter:
    @gerryhampson

  • Any API for XML-based JAAS Provider management

    Hi, All:
    I am working on creating a realm based on jazn-data.xml, it is a XML-based JAAS provider. the jazn.jar shell seems to provide utilities to manage a realm. I am just wondering if there is any API available for XML-based JAAS Provider management.
    The package com.evermind.security oracle.security.jazn oracle.security.jazn.realm seems to be the proper API. However, accoring to the API doc, it seems that the API can not directly work for jazn-data.xml, any body have sugguestions?
    I'd really appreciate your help.

    Hi,
    you should look towards jGuard (www.jguard.net) which enables easy JAAS integration into j2ee webapps across many applications servers(including OC4J, tomcat, jetty, jonas, jboss ...).
    it adds many features including a taglib, some convenient loginmodules(CRL, OCSP, JNDI), and so on....
    cheers,
    Charles(jGuard team).

  • Load external image & text into SWF

    Can someone point me to a tutorial on how to create a
    template that will load an external image file,.css styled text
    & a .css style sheet into a .swf by using .xml?
    Thank you for your time.
    CK

    You can use the MovieClipLoader class to load multiple images sequentially (one at a time), but you wouldn't use a 'for' type of loop...instead you would use a recursive loop, where a loading function is called after each load completion until all loading in done.  This is done by utilizing a load-complete listener to trigger loading of the next image.  So you start the loading process by loading one file, when that file is determined to be loaded, the listener proceses that file in whatever way you need to prepared (resizing, etc) and triggers the loading of the next file.
    If you look up the MovieClipLoader.addListener method in the Flash help documents there is an example there that uses the onLoadInit event.  You would be wanting to use the onLoadComplete event.

  • How do i load an image through XML?

    Hi.
    My code is below. What I am trying is to dinamically load images from xml. I attach the holder from the library, and when i try to target it and addChild to him i get an error:
    var xmlLoader:URLLoader = new URLLoader();
    var xmlData:XML = new XML();
    xmlLoader.addEventListener(Event.COMPLETE, LoadXML);
    xmlLoader.load(new URLRequest("links.xml"));
    var xmlLength:int;
    var iconPos:Number = 0;
    function LoadXML(e:Event):void {
    xmlData = new XML(e.target.data);
    var xmlLength = xmlData.link.length();
    for (var i=0; i<xmlLength; i++) {
    var d:MovieClip = new icon();
    content_mc.addChild(d);
    d.name = "d"+i;
    var target:DisplayObject = content_mc.getChildByName("d"+i);
    var ldr:Loader = new Loader();
    ldr.load(new URLRequest(xmlData.link[i].icon));
    target.addChild(ldr);
    How can i make this happen and load the image into it's holder?
    Thank you.

    Code from adobe's sample packages cut&&paste&&edit:
    AS4 code:
    import flash.events.IOErrorEvent;
    var fotoElenco:Array;
    var fotoXML:XML;
    var fotoURLRequest:URLRequest=new URLRequest();
    var fotoURLLoader:URLLoader=new URLLoader();
    var fotoLoader:Loader=new Loader();
    var fotoPosition:Number=0;
    var errorMessage:TextField=new TextField();
    caricaFoto();
    function caricaFoto():void
        addChild(errorMessage);
        fotoURLRequest.url="gallery.xml";
        fotoURLLoader.load(fotoURLRequest);
        fotoURLLoader.addEventListener(Event.COMPLETE, showFoto);
        fotoURLLoader.addEventListener(IOErrorEvent.IO_ERROR, ioErrorEventXML);
    function ioErrorEventXML(event:IOErrorEvent):void
        manageErrorMessage(true, 0);
    function manageErrorMessage(val:Boolean, num:Number):void
        if(val && num==0){
            errorMessage.x=stage.stageWidth/2;
            errorMessage.y=stage.stageHeight/2;
            errorMessage.text="Errore caricamento file XML";
        if(val && num==1){
            errorMessage.x=stage.stageWidth/2;
            errorMessage.y=stage.stageHeight/2;
            errorMessage.text="Errore caricamento file IMMAGINE";
    function showFoto(event:Event):void
        fwd_mc.buttonMode=true;
        back_mc.buttonMode=true;
        back_mc.addEventListener(MouseEvent.CLICK, manageFoto);
        fwd_mc.addEventListener(MouseEvent.CLICK, manageFoto);
        fotoElenco=new Array();
        fotoXML=XML(fotoURLLoader.data);
        for each(var prop:XML in fotoXML.foto)
            fotoElenco.push({url:prop.@url, didascalia:prop.@didascalia});
        viewFoto(fotoPosition);
        gallery_mc.addChild(fotoLoader);
        manageButton();
    function manageButton():void
        if(fotoPosition<1){
            back_mc.visible=false;
        }else{
            back_mc.visible=true;
        if(fotoPosition>=fotoElenco.length-1){
            fwd_mc.visible=false;
        }else{
            fwd_mc.visible=true;
    function manageFoto(event:MouseEvent):void
        switch(event.currentTarget)
            case fwd_mc:
                if(fotoPosition<fotoElenco.length-1)
                    fotoPosition++;
            break;
            case back_mc:
                if(fotoPosition>0)
                    fotoPosition--;
            break;
        viewFoto(fotoPosition);
    function viewFoto(num:Number):void
        fotoLoader.load(new URLRequest(fotoElenco[num].url));
        fotoLoader.addEventListener(IOErrorEvent.IO_ERROR, ioErrorEventIMG);
        didascalia_txt.text=fotoElenco[num].didascalia;
        manageButton();
    function ioErrorEventIMG(event:IOErrorEvent):void
        manageErrorMessage(true, 1);
    XML code:
    <?xml version="1.0" encoding="UTF-8"?>
    <gallery>
        <foto url="img/immagine1.jpg" didascalia="Didascalia 1 foto"/>
        <foto url="img/immagine2.jpg" didascalia="Didascalia 2 foto"/>
        <foto url="img/immagine1.jpg" didascalia="Didascalia 1 foto"/>
        <foto url="img/immagine2.jpg" didascalia="Didascalia 2 foto"/>
    </gallery>

  • Best Practice - load external image including rollovers

    I am attempting to use the loader component to load an
    external jpg, but experience issues having my flash app
    successfully load a roll-over image from an external source when
    the user rolls over the intital jpg. I am not a flash developer
    (actually a .net developer trying to help a graphics guy out).
    I started with the loader component, converted it to a movie
    clip and then utilized the on(rollover) and on(rollout) events to
    change the loader component's contentPath property at runtime via
    ActionScript. I am not getting consistent results with this
    strategy - what is the best way to accomplish this? Also note I
    tried converted to a button, which seemed more logical, but the
    loader component doesn't seem to like being converted to a button.
    Regards,
    Daflookie

    Daflookie,
    > I started with the loader component, converted it to a
    movie
    > clip and then utilized the on(rollover) and on(rollout)
    events
    > to change the loader component's contentPath property at
    > runtime via ActionScript. I am not getting consistent
    results
    Check out the Loader class in the Components Language
    Reference. Loader
    extends MovieClip, so there's no need to convert to a movie
    clip symbol. In
    addition, I recommend scrapping on() in favor of MovieClip
    events, which
    will probably be closer to your .NET point of view that the
    older
    on/onClipEvent approach to event handling (those are Flash
    5-era).
    Honestly, though, if you simply want to load images, I would
    forego the
    Loader component (no need for all that overhead) and use
    MovieClipLoader to
    load your images into the user's Internet cache. You'll see a
    good handful
    of events under that class listing as well (see the
    ActionScript 2.0
    Language Reference).
    David Stiller
    Adobe Community Expert
    Dev blog,
    http://www.quip.net/blog/
    "Luck is the residue of good design."

  • Making a loaded external image into a button in Actionscript

    My name is Steve Oatman I am a student at
    AIO for a Web Design Diploma
    class: Interactive Telecommunications IMD412 XA
    Professors to bussy!
    I have a flash web site that I am putting together. I am using AS to load some images from an external source. These images are being loaded into a movieclip. These images need to become buttons once they are loaded. The images will link to the particular menu category pages beef, chicken, etc.
    The images are loading fine they just are not responding like a button or link.
    I am getting two error referencing the buttonMode and usehandCursor. Below is just one image that I am working on till I get it to work.
    I am getting these two Compiler error code:
    1119: Access of possibly undefined property buttonMode through a reference with static type flash.display:Loader.
    1119: Access of possibly undefined property useHandCursor through a reference with static type flash.display:Loader.
    This is what I have.
    var myLoader01:Loader = new Loader();
    myLoader01.load(new URLRequest("entrees_images/beef/beef01.gif"));
    addChild(myLoader01);
    myLoader01.x = -269;
    myLoader01.y = -164;
    myLoader01.buttonMode = true;
    myLoader01.useHandCursor = true;
    myLoader01.addEventListener(MouseEvent.CLICK, beefClick);
    function beefClick(event:MouseEvent):void{
    gotoAndStop("beef");
    From me searching online I thought the
    name.buttonMode = true;
    turned the element into a button!
    I have included the fla file. This is in the menuItems_mc which is located in the pageContent_mc frame 40 layer page Image or of course the library.
    I know this is a little in depth sorry and any help would be greatly appreciated.
    Steve
    713/742-3325

    Try something along the following lines:
    var myLoader01:Loader = new Loader();
    function addIt(evt:Event):void{
       var aBtn:MovieClip = new MovieClip();
       aBtn.x = -269;
       aBtn.y = -164;
       aBtn.buttonMode = true;
       addChild(aBtn);
       aBtn.addChild(myLoader01);
       aBtn.addEventListener(MouseEvent.CLICK, beefClick);
    myLoader01.contentLoaderInfo.addEventListener(Event.COMPLETE, addIt);
    myLoader01.load(new URLRequest("entrees_images/beef/beef01.gif"));
    function beefClick(event:MouseEvent):void{
       gotoAndStop("beef");

  • AS3 Load external image and add multiple instances to mcs

    Hi,
    Is there any way to load an external image and add it to more than one movie clip?
    Thanks,
    Chris McLaughlin

    Hi kglad,
    I was loading a larger jpeg to which I was applying 20 different masks so using the bitmapdata class to create duplicates was the best solution.
    It took me some time to wrap my head around it, but all is well.
    Thanks for pointing me in the right direction.
    Best regards,
    Chris

  • Loading External Images

    Hey, I've been having a niggly problem for a while now. I'm
    using MovieClipLoader and a Listener to load in external images.
    All the images load in fine, but often (not always) the onLoadInit
    and onLoadComplete events don't seem to work on the last image I
    load, so if I've got a dynamic text box that I want to disappear
    when loading is complete, it doesn't, only on the last image of a
    group, even tho the image itself loads correctly.
    Anyone come across this before? You can see an example on the
    index page of
    this site.

    nice site, good job :) I would guess that if you are using
    both events on the same call, one is getting triggered before the
    other, since they both operate at a similar time. similar but not
    the same, onLoadComplete happens when the load is complete,
    onLoadInit happens when the first frame of the loaded timeline
    plays. Therefore if your listening for both on the same load call,
    one may happen before the other, and may override or change the
    event sequence, occationally.
    Just a guess though, I think you should consider using one or
    the other, and firing all other functions from there.

  • Unable to load external image into iOS app with AS3

    Just trying out Flash Builder for iOS app development and have run into a problem right off the bat with loading an external image into an iOS app.  The actionscript is very simple (this was basically my Hello World attempt), and I'm hoping someone here can explain where I'm going wrong.  This code works in Flash Pro, and works when launched on the desktop from Flash Builder, but doesn't work on my iOS devices.
    Here's the code:
                                  var container:MovieClip = new MovieClip();
                                  addChild(container);
                                  var imageLoader:Loader = new Loader();
           imageLoader.load(new URLRequest("http://www.google.ca/intl/en_ALL/images/logos/images_logo_lg.gif"));
                                  imageLoader.contentLoaderInfo.addEventListener(Event.COMPLETE, startListener);
      function startListener (e:Event):void{
                                                 container.addChild(imageLoader);
    Any thoughts on why this won't work would be greatly appreciated!

    I had the same issue, and modified my domain policy file as specified  in http://www.adobe.com/devnet/flashplayer/articles/fplayer9_security.html#_Configuring_URL_M eta-Policies but the loader is not loading the file. Any ideas on how to fix this issue?

  • Problem loading external images

    I'm having a problem. I am creating a portfolio section for a
    class project.
    I have it so that when I click on my portfolio the images
    load externally. The problem comes in where when you click onto
    another section the last portfolio piece stays on screen and
    doesn't go away. Anyone have any ideas how to fix this? Code is
    attached.

    Thank you for the response.
    But I must admit that I don't understand what you are saying.
    I'm a newbie with actionscript 3 and it is still a bit confusing.
    Could you break it down so that it is easier for me to understand
    your response.
    Thanks.

Maybe you are looking for