A Flash Developer Resource Site

Results 1 to 6 of 6

Thread: Preloader overlaps first frame of website

  1. #1
    Junior Member
    Join Date
    Apr 2011
    Posts
    13

    Preloader overlaps first frame of website

    Hi there, my Flash (CS4/AS3) website has turned out to be pretty huge- it's my first site and I'm ok with it taking a while to load at this time.. planning to clean things up later but need it running in the meantime. I needed a preloader at the beginning, but as so many actions in the site were tied to frame numbers, I decided to make the index.html a swf containing only the preloader and a UI loader, which loads the main site. This works ok, except the site appears to load before the preloader is finished, so the loading bar overlaps the site and the site is only half functional during these few seconds. Anyone have any advice to keep the site from loading until the preloader finishes? The website is www.bespokeglasstile.com and the code I'm using for the preloader is below.
    Thanks!!!


    var imageURL:String = "bespoke_glass_tile.swf";
    var request:URLRequest = new URLRequest(imageURL);
    bgtUI.load(request);

    progressBar.source = bgtUI;
    progressBar.addEventListener(ProgressEvent.PROGRES S, progressHandler);
    progressBar.addEventListener(Event.COMPLETE, completeHandler);

    function progressHandler (event:ProgressEvent):void {
    status_txt.text = int(event.currentTarget.percentComplete) + "%";
    }

    function completeHandler (event:Event): void {
    progressBar.removeEventListener(ProgressEvent.PROG RESS, progressHandler);
    progressBar.removeEventListener(Event.COMPLETE, completeHandler);
    removeChild(progressBar);
    status_txt.text = "";
    }

  2. #2
    Mod cancerinform's Avatar
    Join Date
    Mar 2002
    Location
    press the picture...
    Posts
    13,449
    Try this. Make bgtUI alpha=0. In the completeHandler function you make bgtUI alpha=100.
    - The right of the People to create Flash movies shall not be infringed. -

  3. #3
    Junior Member
    Join Date
    Apr 2011
    Posts
    13
    No luck, the site still appears under the loader bar when the preloader is less than half done. This is how I added the alpha in, in case I've written it wrong...

    var imageURL:String = "bespoke_glass_tile.swf";
    var request:URLRequest = new URLRequest(imageURL);
    bgtUI.load(request);
    bgtUI.alpha = 0;

    progressBar.source = bgtUI;
    progressBar.addEventListener(ProgressEvent.PROGRES S, progressHandler);
    progressBar.addEventListener(Event.COMPLETE, completeHandler);

    function progressHandler (event:ProgressEvent):void {
    status_txt.text = int(event.currentTarget.percentComplete) + "%";
    }

    function completeHandler (event:Event): void {
    progressBar.removeEventListener(ProgressEvent.PROG RESS, progressHandler);
    progressBar.removeEventListener(Event.COMPLETE, completeHandler);
    removeChild(progressBar);
    status_txt.text = "";
    bgtUI.alpha = 100;
    }

  4. #4
    Senior Member
    Join Date
    Jan 2011
    Posts
    171
    Actionscript Code:
    progressBar.parent.removeChild(progressBar);


    arkitx

  5. #5
    Registered User
    Join Date
    May 2012
    Posts
    1
    The problem is that whilst your preloader bar is showing 10%, it should actually be showing 100% as the loading has completed.

    Change your code to the following and see what happens. What you should see happen is that once your SWF appears the textbox should also be shown in the top left saying "Preloader fully complete at 10 (or 100)". If this is indeed what happens then take the second bit of code and replace your current code with it.

    var textBox:textfield = new textfield() // we'll use this to bug catch
    var imageURL:String = "bespoke_glass_tile.swf";
    var request:URLRequest = new URLRequest(imageURL);
    bgtUI.load(request);
    bgtUI.alpha = 0;

    progressBar.source = bgtUI;
    progressBar.addEventListener(ProgressEvent.PROGRES S, progressHandler);
    progressBar.addEventListener(Event.COMPLETE, completeHandler);

    function progressHandler (event:ProgressEvent):void {
    status_txt.text = int(event.currentTarget.percentComplete) + "%";
    }

    function completeHandler (event:Event): void {
    addChild(textBox); // adding textbox to top left
    textBox.text = "Preloader fully complete at "+event.currentTarget.percentComplete // tracing where we're at when the complete handler is given
    progressBar.removeEventListener(ProgressEvent.PROG RESS, progressHandler);
    progressBar.removeEventListener(Event.COMPLETE, completeHandler);
    removeChild(progressBar);
    status_txt.text = "";
    bgtUI.alpha = 100;
    }

    ---

    If the above showed the textbox at "10%", then:

    var imageURL:String = "bespoke_glass_tile.swf";
    var request:URLRequest = new URLRequest(imageURL);
    bgtUI.load(request);
    bgtUI.alpha = 0;

    progressBar.source = bgtUI;
    progressBar.addEventListener(ProgressEvent.PROGRES S, progressHandler);
    progressBar.addEventListener(Event.COMPLETE, completeHandler);

    function progressHandler (event:ProgressEvent):void {
    status_txt.text = int((event.currentTarget.percentComplete)*10) + "%";
    }

    function completeHandler (event:Event): void {
    progressBar.removeEventListener(ProgressEvent.PROG RESS, progressHandler);
    progressBar.removeEventListener(Event.COMPLETE, completeHandler);
    removeChild(progressBar);
    this.parent.removeChild(status_txt); // if this doesnt work, use "status_txt" instead of "this", but "this" should work
    this.parent.removeChild(progressBar); // if this doesnt work, use "progressBar" instead of "this", but "this" should work
    status_txt.text = "";
    bgtUI.alpha = 100;
    }

    I hope that helps.

    _______________________
    Regards,
    Kevin
    Flash Game Developer

  6. #6
    Flash Game Developer mesmerize's Avatar
    Join Date
    Dec 2005
    Location
    United Kingdom, near Leicester.
    Posts
    485
    function progressHandler (event:ProgressEvent):void {
    status_txt.text = int((event.currentTarget.percentComplete)*10) + "%";
    }

    function completeHandler (event:Event): void {
    progressBar.removeEventListener(ProgressEvent.PROG RESS, progressHandler);
    progressBar.removeEventListener(Event.COMPLETE, completeHandler);
    removeChild(progressBar);
    this.parent.removeChild(status_txt);
    this.parent.removeChild(progressBar);
    bgtUI.alpha = 100;
    }

Tags for this Thread

Posting Permissions

  • You may not post new threads
  • You may not post replies
  • You may not post attachments
  • You may not edit your posts
  •  




Click Here to Expand Forum to Full Width

HTML5 Development Center