www.webdeveloper.com
Results 1 to 6 of 6

Thread: Flash over PHP/HTML text. (not embedding)

  1. #1
    Join Date
    Dec 2009
    Posts
    8

    Red face Flash over PHP/HTML text. (not embedding)

    Hi,

    First of, I am not sure if I am posting in the correct forum, I apologize if I do. However I have some "Flash on HTML webpage" inquiries I hope somebody can help me in here.

    I have a Flash call flash.swf and I have a HTML file call webpage.html

    1. Instead of embedding my flash on the webpage, I am looking at how can I load a flash on top of my HTML webpage text and content without the use of the normal browser window navigation.
    2. What is the actionscript to close down the flash.swf while loading on my webpage.


    I am not good in programming, does anyone have any experience or solutions to my 2 inquiry?

    Regards

    ipple
    Last edited by ipple; 01-07-2010 at 08:18 AM.

  2. #2
    Join Date
    Feb 2008
    Location
    NW Washington State
    Posts
    1,856
    Looking for a few more details:
    Are you expecting both the Flash and the Web page to download at the same time by clicking a link to the page or typing the page address into browser address bar?
    Is there any connection between the Web page and the Flash, such as, "Click here" and something in the Flash changes or Click the Flash and something on the Web page changes?
    Is this suppose to be available to anyone visiting the site or will this just happen on your own, local machine?
    Will the .swf be interactive and do things or is it just to display static text and/or images?
    To you want the Flash window independent so you can move it around or what?
    Why do you want the Flash outside of the Web page?
    Any more specific details would be helpful.
    Best wishes,
    Eye for Video
    www.cidigitalmedia.com

  3. #3
    Join Date
    Dec 2009
    Posts
    8

    Wink Thanks Eye for Video!

    Dear Eye for Video

    Thanks for your prompot response, this is one example, please take a look

    The flash is on top of the star picture of the webpage.

    http://www.communitymx.com/content/s...wmodetrans.htm

    To answer your questions,

    Are you expecting both the Flash and the Web page to download at the same time by clicking a link to the page or typing the page address into browser address bar?

    I am not expecting the Flash to load at the same time as the webpage, however I am expecting the webpage.html to load first while the flash.swf loads the animation infront of the webpage.html.

    Is there any connection between the Web page and the Flash, such as, "Click here" and something in the Flash changes or Click the Flash and something on the Web page changes?

    Basically it is a flash website template that have buttons and links on the Flash itself and not linking to my webpage.html however there should be an exit button to shut down the flash while the flash is loading.

    Is this suppose to be available to anyone visiting the site or will this just happen on your own, local machine?

    Anyone visiting the site.


    Will the .swf be interactive and do things or is it just to display static text and/or images?

    The flash.swf is like a generate Flash website template swf that should be placed above the webpage.html

    To you want the Flash window independent so you can move it around or what?

    If possible I would like to move around it or at the least follow the scroll bar vertically and that it can only be exited using the cancel button that I intend to build on the Flash.

    Why do you want the Flash outside of the Web page?

    Reason being is that I would want a HTML page to be loaded first instead of a full flash webpage that will take time to load. Should the user becomes impatient with the loading of the Flash, the user is able to cancel the Flash and view the webpage.html instead.

    Whether you manage to find a solution or so I am very grateful for your prompt response, Thanks!
    Last edited by ipple; 01-07-2010 at 08:59 AM.

  4. #4
    Join Date
    Feb 2008
    Location
    NW Washington State
    Posts
    1,856
    OK, the example in the link above is using two important aspects, first, is the wmode, which makes the background (or stage) of the Flash document transparent. In other words, only the objects you've placed on the Flash stage will show, the Web page will appear as the background. Keep in mind however, that if you use one large image as a background on the stage, it will cover the entire Flash area and block the Web page from showing through.
    The second aspect is the use of a declared position and z-indexing for the Flash content. So taken together it works like this...
    Flash content is given
    Code:
    wmode="transparent"
    so you can see through the Flash and see any part of Web page not covered by objects on the Flash stage.
    Then place that Flash over the top of content already on the Web page by declaring a position and giving it a z-index.
    Code:
    position: absolute; 
    z-index: 3;
    From a couple of old posts:
    Window Mode (wmode) - What's It For?
    There are three window modes.
    Window
    Opaque
    Transparent
    By default, the Flash Player gets its own hWnd in Windows. This means that the Flash movie actually exists in a display instance within Windows that lives above the core browser display window. So though it appears to be in the browser window, technically, it isn't. It is most efficient for Flash to draw this way and this is the fastest, most efficient rendering mode. However, it is drawing independently of the browser's HTML rendering surface. This is why this default mode (which is equivalent to wmode="window") doesn't allow proper compositing with DHTML layers. This is why your JavaScripted drop-down menus will drop behind your Flash movie.
    In windowless modes (like opaque), Flash Player doesn't have a hWnd. This means that the browser tells the Flash Player when and where to draw onto the browser's own rendering surface. The Flash movie is no longer being rendered on a higher level if you will. It's right there in the page with the rest of the page elements. The Flash buffer is simply drawn into whatever rectangle the browser says, with any Flash stage space not occupied by objects receiving the movie's background color.
    And for positioning:
    The thing missing from your positioning is that unless the parent element also has a declared position, the child will do 1 of 2 things.
    If position:relative, it will position as desired but space will be left as though that element was still in the natural flow. So you may move the 500 X 100 element down and over, but a 500 X 100 space will be left, as though it was still there.
    If position:absolute, child is positioned relative to browser window and that position does not change even if window contracts or expands.
    For more details on positioning and z-index:
    http://www.w3schools.com/Css/css_positioning.asp
    Best wishes,
    Eye for Video
    www.cidigitalmedia.com

  5. #5
    Join Date
    Dec 2009
    Posts
    8

    Eye for Video, flash container

    Dear Eye for Video,

    Thanks for enlightening me on the opaque and transparency of the flash however, I noticed there is a flash container declared on the css.

    #flashcontain {
    border: 1px solid #333;
    width: 200px;
    position: absolute;
    top: 45px;
    left: 10px;
    z-index: 2;
    }

    is this necessary? What codes do I need to insert on my php file which is the webpage.html to display my flash.swf then?

    Regards

    ipple

  6. #6
    Join Date
    Feb 2008
    Location
    NW Washington State
    Posts
    1,856
    Yes, use the css...you need to declare a position and use the z-indexing to work like the sample you posted. Also set the width and height to exact same as the Flash doc size. You'll also need to declare a position for the parent element of "flashcontain" or the positioning may not work correctly. See info on "how to position"
    Then on the actual Web page you need something like this:
    Code:
    <div id="flashcontain">
    	<object id="myflash"type="application/x-shockwave-flash" data="yourflash.swf" width="500" height="200">
    		<param name="movie" value="yourflash.swf">
    		<param name="quality" value="high" />
    		<param name="wmode" value="transparent"/>		
    	</object>
    	</div>
    Be sure to change name of .swf and set correct dimensions. There are lots of ways to place the Flash on the page but this will get you started. You can also use swfobject (which I would recommend), but it's a little more complicated to get working correctly.
    http://code.google.com/p/swfobject/
    Best wishes,
    Eye for Video
    www.cidigitalmedia.com

Thread Information

Users Browsing this Thread

There are currently 1 users browsing this thread. (0 members and 1 guests)

Posting Permissions

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



Recent Articles