SitePoint Sponsor

User Tag List

Results 1 to 8 of 8
  1. #1
    SitePoint Member
    Join Date
    Jul 2009
    Posts
    11
    Mentioned
    0 Post(s)
    Tagged
    0 Thread(s)

    Unhappy Multiple Flash objects on page, delay load by X-seconds

    Ok, the situation: I'm building a web page, and the client wants to have three flash galleries on staggered timing (i.e., the first one loads and runs, 4 seconds later the second loads and runs, 4 seconds later, third one loads and runs).

    I've been trying to figure out how to use Javascript to handle the initial delay between each object, and the best I can figure is to use an onLoad to start the first flash (Flash1), and then call out a function with setTimeout to start Flash2 4 seconds after Flash1 loads, and the same thing for Flash3. However, my attempts thus far have failed, and all three load up at the same time.

    The test page is here: http://www.caseygrouparch.com/a-p_we...flash_test.htm

    Each flash will (eventually) refer to a separate external XML file for the images, but currently they're all referring to the same XML for the sake of simplifying things for me at this stage.

    My script is as follows:
    Code:
    <script type="text/javascript">
    
    window.onload = function() {
    	document.getElementById("flashintro1");
    	setTimeout ("loadFlash2()", 4000);
    }
    
    function loadFlash2 () {
    	document.getElementById("flashintro2");
    	setTimeout ( "loadFlash3()", 4000 );
    }
    
    function loadFlash3 () {
    	document.getElementById("flashintro3");
    }
    
    </script>
    "flashintro1", etc., are the IDs for the DIV's holding each flash object.

    I've been scouring the web for tutorials and instructions so long that my brain is melting. Please help!

    Thanks a bunch!
    ~Shae

  2. #2
    SitePoint Wizard bronze trophy chris.upjohn's Avatar
    Join Date
    Apr 2010
    Location
    Melbourne, AU
    Posts
    2,196
    Mentioned
    17 Post(s)
    Tagged
    1 Thread(s)
    I don't see anything in your code that is hiding or showing the div elements, try this

    Code JavaScript:
    window.onload = function() {
        var flashElements = ["flashintro1","flashintro2","flashintro3"];
        var lastTimer, timer = (lastTimer && lastTimer == 4000) ? lastTimer+1000 : 4000;
     
        for(var i in flashElements){
            var e = document.getElementById(flashElements[i]);
            e.style.display = "none";
     
            setTimeout(function(){e.style.display="block";}, timer);
            lastTimer = timer;
        }
    }

  3. #3
    SitePoint Member
    Join Date
    Jul 2009
    Posts
    11
    Mentioned
    0 Post(s)
    Tagged
    0 Thread(s)
    That seems to be going in the right direction, however, it delays the first .swf, and the others don't appear.

    Also, I realized my initial post may have been misleading, so for clarification just in case, I'm looking for the three flash files to run concurrently, rather than one starting after the previous has finished (as they are each a looping gallery).

  4. #4
    SitePoint Member Yi.Sage's Avatar
    Join Date
    Nov 2010
    Posts
    21
    Mentioned
    0 Post(s)
    Tagged
    0 Thread(s)
    you can try to load the flash dynamic using JavaScript.
    i'll give you some code later. wait a moment.

  5. #5
    SitePoint Member Yi.Sage's Avatar
    Join Date
    Nov 2010
    Posts
    21
    Mentioned
    0 Post(s)
    Tagged
    0 Thread(s)
    Code JavaScript:
    function getFlashMovieObject(movieName) {
                        if (window.document[movieName]) {
                            return window.document[movieName];
                        }
                        if (navigator.appName.indexOf("Microsoft Internet") == -1) {
                            if (document.embeds && document.embeds[movieName])
                                return document.embeds[movieName];
                        }
                        else
                        {
                            return document.getElementById(movieName);
                        }
                    }
                    window.onload = function () {                    
                        PlayFlash("flash1",0);
                        PlayFlash("flash2", 1000);
                        PlayFlash("flash3", 1000);
                    }
     
                    function PlayFlash(name, delay) {
                        setTimeout(function () {
                            getFlashMovieObject(name).Play();
                        }, delay);
                    }

    try this.

    and you should set the object element's id and the embed's name.
    Like this.
    Also add a param called "play" and set its value to false,

    <object classid="clsid:d27cdb6e-ae6d-11cf-96b8-444553540000" codebase="http://fpdownload.macromedia.com/pub/shockwave/cabs/flash/swflash.cab#version=6,0,0,0"
    style="" align="middle" height="150" width="150" id="flash1">
    <param name="allowScriptAccess" value="sameDomain">
    <param name="movie" value="flash1/slideshow1_250x333.swf">
    <param name="quality" value="High">
    <param name="bgcolor" value="#000000">
    <param name="play" value="false" />

    <embed src="flash1/slideshow1_250x333.swf" quality="High" bgcolor="#000000"
    name="flash1" allowscriptaccess="sameDomain" type="application/x-shockwave-flash"
    pluginspage="http://www.macromedia.com/go/getflashplayer" align="middle" height="150"
    width="150" play="false" >

  6. #6
    SitePoint Member Yi.Sage's Avatar
    Join Date
    Nov 2010
    Posts
    21
    Mentioned
    0 Post(s)
    Tagged
    0 Thread(s)
    it was not dynamic loading the flash and just played the flash of your setting( milliseconds later).

    I think it enough for u. No need to load dynamic .

  7. #7
    SitePoint Member
    Join Date
    Jul 2009
    Posts
    11
    Mentioned
    0 Post(s)
    Tagged
    0 Thread(s)

    Question

    it was not dynamic loading the flash and just played the flash of your setting( milliseconds later).

    I think it enough for u. No need to load dynamic .
    I'm not sure I understand what you mean by that, but, it doesn't seem to be working. Everything still loads at the same time. I entered the additional parameters you specified, and additionally tried it again after removing the IDs of the DIV's the flash objects are placed in (just to see if it made a difference. It didn't).

    I appreciate all of your suggestions! Maybe I'm just missing something on my end...

  8. #8
    SitePoint Member
    Join Date
    Jul 2009
    Posts
    11
    Mentioned
    0 Post(s)
    Tagged
    0 Thread(s)

    Lightbulb

    Ah-ha! I've figured it out! Or at least, it seems to be working the way I want it to. This is my JS:

    Code JavaScript:
    <script type="text/javascript">
    window.onload=function() {
    	document.getElementById("flashintro1").style .display="block";	
    	setTimeout('document.getElementById("flashintro2").style .display="block"',3000);
    	setTimeout('document.getElementById("flashintro3").style .display="block"',6000);
    	return;
    	}
    </script>

    Each flash object appears as this in the HTML (with the Object ID changing):

    Code HTML4Strict:
    			<div style="float:left; margin-right:15px;">
    				<object id="flashintro1" classid="clsid:d27cdb6e-ae6d-11cf-96b8-444553540000" codebase="http://fpdownload.macromedia.com/pub/shockwave/cabs/flash/swflash.cab#version=6,0,0,0" width="150" height="150" align="middle" style="float: middle">
    					<param name="allowScriptAccess" value="sameDomain" />
    					<param name="movie" value="flash1/slideshow1_250x333.swf" />
    					<param name="quality" value="High" />
    					<param name="bgcolor" value="#000000" />
    					<embed src="flash1/slideshow1_250x333.swf" quality="High" bgcolor="#000000" width="150" height="150" name="slideshow_as2" align="middle" allowScriptAccess="sameDomain" type="application/x-shockwave-flash" pluginspage="http://www.macromedia.com/go/getflashplayer" />
    				</object>
    			</div>

    The wrapper DIVs are set to display:none in the CSS.

    Now hopefully it all still works when I actually load in the right images... Thanks for your help, guys!


Bookmarks

Posting Permissions

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