Hi guys You prompted me to add a new (quickie/ugly) example to learnswfobject.com: http://learnswfobject.com/advanced-topics/using-a-swf-as-a-background-image/
Demo: http://demos.learnswfobject.com/html-over-swf/dynamic-full-browser.html - philip On Wed, May 5, 2010 at 7:01 PM, Aran Rhee <[email protected]> wrote: > Hey Larry. > > I'm glad it's starting to gel for you. > > re: 100% filling - have a read > http://learnswfobject.com/advanced-topics/100-width-and-height-in-browser/ > > demo: > http://demos.learnswfobject.com/full-browser/dynamic.html > > FAQ entry (#1) > http://code.google.com/p/swfobject/wiki/faq > > > Cheers, > Aran > > > > > On Thu, May 6, 2010 at 11:53 AM, Larry Wakeman <[email protected]>wrote: > >> I'M GROKKING! >> >> Thanks Aran - we learn more when we have to read through it ourselves :) >> >> Here's my answer that's working. I didn't know that the version was the >> minimum necessary - I thought it was my version as it said in some >> articles. The styling on the flash target div is meaningless as it gets >> replaced anyway. I also moved the flash target div completely out of the >> rest of the content div's. This allowed me to style the flash object with >> an enclosing div. I'm sure this is what you and Sam meant. I had to tweak >> the height of the flash object (to 870) in order to make it fill the screen >> totally. Maybe there's another way to ensure it fills the entire >> background. This height probably varies with screen resolution. I guess >> all div's must now be positioned absolute, or at least the parent >> containers. >> >> >> <head> >> <script type="text/javascript"> >> var flashvars = {}; >> var params = {}; >> params.wmode = "opaque"; >> var attributes = {}; >> swfobject.embedSWF("RainbowWishBackgroundText.swf", "flashTarget", >> "100%", "870", "9.0.0", "expressInstall.swf", flashvars, params, >> attributes); >> >> </script> >> >> </head> >> <body> >> <form id="form1" runat="server"> >> <div style="position: absolute; left: 0px; top: 0px; width: 100%;"> >> <div id="flashTarget"> >> Flash Player version of at least 9.0.0 is required to see the >> beautiful background! >> </div> >> </div> >> >> <div id="Background" style="position: absolute; top: 0px; left: 0px; >> width: 100%;"> >> <asp:Label ID="lblTest" runat="server" Text="HELLO >> WORLD"></asp:Label> >> <div> >> <asp:ContentPlaceHolder id="cntBody" runat="server"> >> >> </asp:ContentPlaceHolder> >> </div> >> </div> >> </form> >> </body> >> >> On Wed, May 5, 2010 at 8:45 PM, Aran Rhee <[email protected]> wrote: >> >>> Hi Larry. >>> >>> 2.0 vs 2.2 - All 2.x version use the same API / strategy, so this does >>> not matter. >>> >>> I suggest you read this tut: >>> >>> http://learnswfobject.com/advanced-topics/placing-html-elements-over-a-flash-movie/ >>> >>> example: >>> http://demos.learnswfobject.com/html-over-swf/dynamic.html >>> >>> You do not actually need to specify a z-index. >>> >>> re: wmode - wmode opaque works in SWFObject 1.x and 2.x (or old >>> object/embed method), it is just most people misunderstand/stood what the >>> modes actually mean. The default mode ="window" which means the swf is >>> actually rendered on a completely independent windowed layer above all web >>> page content. Once you specify either opaque or transparent, the swf will be >>> a part of the layer stack of the html content. Transparent removes the >>> background color from your swf and allows content behind the swf to show >>> through the swf. Opaque does not let contnet show through, but it allows you >>> to position other elements either behind or in front of the swf based on >>> position / layers. >>> >>> expressInstall has nothing to do with the error you are seeing, as it >>> will only be invoked if the user does not have your target version of Flash >>> AND they have a flash player >=6.0.65. >>> >>> >>> >>> Aran >>> >>> <http://learnswfobject.com/advanced-topics/placing-html-elements-over-a-flash-movie/> >>> >>> On Thu, May 6, 2010 at 10:23 AM, Larry Wakeman >>> <[email protected]>wrote: >>> >>>> Thanks Sam and Aran! I'm trying your techniques. I'm still not sure >>>> where the sub-page ContentPlaceHolder control goes. There were a couple >>>> mistakes on my original question: First, the scrolling text was there, I >>>> just hadn't set it up right with my new version of my website. Second, I'm >>>> on swfobject 2.2, not 2.0. >>>> >>>> Sam - you shouldn't have any trouble getting on my site - it's been >>>> online for years, and works in the latest Firefox and IE7. Maybe you >>>> spelled it wrong? http://www.rainbowandwish.com >>>> >>>> Now, to your ideas. I've read everywhere that the only way to get your >>>> content to float on top of your flash background was to make the swfobject >>>> transparent. I know that was the case with the old swfobject Now you're >>>> saying opaque is the way to go? Also, with the old swfobject I had z-index >>>> = 1, but it didn't seem to make any difference with the new one. >>>> >>>> Here's what I have now with your suggestions, with inline styling so you >>>> can easily see it. What happens now is that Hello World is at the top of >>>> the screen with white background. Below that is the flash background. If >>>> in my default.aspx page I position the controls with absolute, they DO rest >>>> on top of the background, but I'm not sure I want all my content to be >>>> position absolute. I'd like it to grow and shrink with the page. >>>> >>>> I still want the flash background behind Hello World. I tried both >>>> opaque and transparent, z-index = 1 and no z-index, and none of these >>>> settings made the least bit of difference. Maybe there's something wrong >>>> with expressInstall.swf? With the code below I certainly see why it comes >>>> out the way it does, but if the swf object wipes out everything in the div, >>>> then how else can you do it? >>>> >>>> I also tried the z-index on the ContentPlaceHolder and content controls >>>> placed relative, but same thing - they appear at the bottom of the screen >>>> after the swfobject. >>>> >>>> <head> >>>> ... >>>> >>>> <script type="text/javascript"> >>>> var flashvars = {}; >>>> var params = {}; >>>> params.wmode = "opaque"; >>>> var attributes = {}; >>>> >>>> swfobject.embedSWF("RainbowWishBackgroundText.swf", >>>> "flashTarget", "100%", "900", "9.0.0", "expressInstall.swf", flashvars, >>>> params, attributes); >>>> >>>> </script> >>>> >>>> </head> >>>> <body> >>>> <form id="form1" runat="server"> >>>> <div id="Background" style="position: absolute; top: 0px; left: 0px; >>>> width: 100%;"> >>>> >>>> <asp:Label ID="lblTest" runat="server" Text="HELLO >>>> WORLD"></asp:Label> >>>> <div id="flashTarget" style="position: absolute; top: 0px; left: >>>> 0px; width: 100%; z-index: 1;"></div> >>>> >>>> <div> >>>> <asp:ContentPlaceHolder id="cntBody" runat="server"> >>>> >>>> </asp:ContentPlaceHolder> >>>> </div> >>>> </div> >>>> </form> >>>> </body> >>>> >>>> >>>> =================================================================================== >>>> >>>> >>>> On Wed, May 5, 2010 at 12:28 AM, Sam Sherlock >>>> <[email protected]>wrote: >>>> >>>>> in addition to Aran's advice z-index was not set on your background >>>>> >>>>> I wrapped the content in a div with id "content" and set the z-index >>>>> on there. >>>>> >>>>> Sony Playstation also uses the same trick I could not load the example >>>>> rainbow site; >>>>> >>>>> >>>>> - S >>>>> >>>>> >>>>> -- >>>>> You received this message because you are subscribed to the Google >>>>> Groups "SWFObject" group. >>>>> To post to this group, send email to [email protected]. >>>>> To unsubscribe from this group, send email to >>>>> [email protected]<swfobject%[email protected]> >>>>> . >>>>> For more options, visit this group at >>>>> http://groups.google.com/group/swfobject?hl=en. >>>>> >>>> >>>> >>>> >>>> -- >>>> Larry Wakeman >>>> http://www.lianaent.com >>>> >>>> >>>> -- >>>> You received this message because you are subscribed to the Google >>>> Groups "SWFObject" group. >>>> To post to this group, send email to [email protected]. >>>> To unsubscribe from this group, send email to >>>> [email protected]<swfobject%[email protected]> >>>> . >>>> For more options, visit this group at >>>> http://groups.google.com/group/swfobject?hl=en. >>>> >>> >>> -- >>> You received this message because you are subscribed to the Google Groups >>> "SWFObject" group. >>> To post to this group, send email to [email protected]. >>> To unsubscribe from this group, send email to >>> [email protected]<swfobject%[email protected]> >>> . >>> For more options, visit this group at >>> http://groups.google.com/group/swfobject?hl=en. >>> >> >> >> >> -- >> Larry Wakeman >> http://www.lianaent.com >> >> -- >> You received this message because you are subscribed to the Google Groups >> "SWFObject" group. >> To post to this group, send email to [email protected]. >> To unsubscribe from this group, send email to >> [email protected]<swfobject%[email protected]> >> . >> For more options, visit this group at >> http://groups.google.com/group/swfobject?hl=en. >> > > -- > You received this message because you are subscribed to the Google Groups > "SWFObject" group. > To post to this group, send email to [email protected]. > To unsubscribe from this group, send email to > [email protected]<swfobject%[email protected]> > . > For more options, visit this group at > http://groups.google.com/group/swfobject?hl=en. > -- You received this message because you are subscribed to the Google Groups "SWFObject" group. To post to this group, send email to [email protected]. To unsubscribe from this group, send email to [email protected]. For more options, visit this group at http://groups.google.com/group/swfobject?hl=en.
