Welcome!

And don't forget to edit your signature & profile.

 

Icon

Statistics

  • Total posts 23318
  • Total topics 4048
  • Total members 5574
  • Our newest member
    ALF5583

TOP POSTERS

100% height and 100% width of Browser

Related to Adobe Flash and Shockwave.
   

100% height and 100% width of Browser

Postby breastfed » Mon May 04, 2009 11:56 am

Hello

after 1 Hours trying several "Tips" from Forums i need to write you here...

I want to create a Flash Page with the Dimensions 600*400 - in the Background there should be a texture of wood.

Now i want this Texture to be 100% * 100% of my Browser's Dimension without resizing the Centerbox, the page.

As you can see in the Attachement it is not working for me.

Please help me out guys.

Thanks!
"A day without a Table is a good day."
User avatar
breastfed
Smashing <table>
 
Posts: 46
Joined: Tue Apr 07, 2009 1:17 pm
Location: Dülmen, Germany
   

   

Re: 100% height and 100% width of Browser

Postby Andy » Mon May 04, 2009 12:17 pm

Well, you didn't provide an attachment but I'll attempt to answer anyway:
(I'll illustrate the example using a div)

Code: Select all
html, body { height: 100%; margin: 0; padding: 0; }
#test { background: green; height: 100%; }


Code: Select all
<div id="test" />
Andy
Smashing <h5>
 
Posts: 1023
Joined: Tue Sep 30, 2008 6:42 pm
Location: Sweden
   

   

Re: 100% height and 100% width of Browser

Postby breastfed » Mon May 04, 2009 12:20 pm

What parameters do i have to give the Movie inside Flash and inside the HTML (not the css) ?
"A day without a Table is a good day."
User avatar
breastfed
Smashing <table>
 
Posts: 46
Joined: Tue Apr 07, 2009 1:17 pm
Location: Dülmen, Germany
   

   

Re: 100% height and 100% width of Browser

Postby Fruityger » Mon May 04, 2009 12:22 pm

Do you need the wood texture to scroll if your content is very large (+600px height) or will this never happen?

I have a solution for an absolute positioned background div that also works in IE6.

Javascript
Code: Select all
<script type="text/javascript" src="http://ajax.googleapis.com/ajax/libs/swfobject/2.1/swfobject.js"></script>
      <script type="text/javascript">
         var flashvars = {};
         var params = {};
         params.wmode = "transparent";
         params.quality = "high";
         var attributes = {};
         swfobject.embedSWF("swf/myflashbackground.swf", "bg", "100%", "100%", "9.0.0",false, flashvars, params, attributes);
      </script>


css
Code: Select all
#bg {
   position: absolute;
   top: 0;
   left: 0;
   margin: 0;
   padding: 0;
   width: 100%;
   height: 100%;
   overflow: hidden;
   z-index:9;
}

#flash-background {
   height: 100%;
}

#wrap {

   padding-top:0px;
   position:relative;
   margin:0px auto;
   width:800px;
   z-index:23;
}


HTML
Code: Select all
<!-- swf background container -->
   <div id="bg">
      <div id="flash-background"></div>
   </div>

<!-- begin content -->
   <div id="wrap">
...
...
...
User avatar
Fruityger
Smashing <div>
 
Posts: 155
Joined: Sun Apr 05, 2009 8:22 pm
   

   

Re: 100% height and 100% width of Browser

Postby breastfed » Mon May 04, 2009 12:36 pm

I might not be clear enough.

This site for example:
http://www.ciriljazbec.com/

The Background is 100% * 100%

Your Code didn't work :(
"A day without a Table is a good day."
User avatar
breastfed
Smashing <table>
 
Posts: 46
Joined: Tue Apr 07, 2009 1:17 pm
Location: Dülmen, Germany
   

   

Re: 100% height and 100% width of Browser

Postby Andy » Mon May 04, 2009 12:50 pm

breastfed wrote:I might not be clear enough.

This site for example:
http://www.ciriljazbec.com/

The Background is 100% * 100%

Your Code didn't work :(


Code: Select all
   html, body { height: 100%; margin: 0; padding: 0; }


Code: Select all
  <body id="flashcontent">
     This will be overwritten with a flash video. 
     <script type="text/javascript" src="swfobject.js"></script>
     <script type="text/javascript">
        var so = new SWFObject("so_tester.swf", "mymovie", "100%", "100%", "8", "#336699");
        so.write("flashcontent");
     </script>
  </body>


And finally download SWFObject here.
Andy
Smashing <h5>
 
Posts: 1023
Joined: Tue Sep 30, 2008 6:42 pm
Location: Sweden
   


Return to Flash



Who is online

Users browsing this forum: No registered users and 1 guest