Use ExternalInterface...
<?xml version="1.0" encoding="utf-8"?>
<mx:Application xmlns:mx="http://www.adobe.com/2006/mxml";
layout="absolute"
backgroundColor="#BBDDDD" initialize="init(event)">
<mx:Script>
<![CDATA[
import mx.events.FlexEvent;
import mx.controls.Alert;
private function init(event:FlexEvent):void
{
if (ExternalInterface.available)
{
var bgcolor:String = ExternalInterface.call("getcss",
"body", "background-color");
if(bgcolor == null)
{
bgcolor =
ExternalInterface.call("getBGColor");
}
}
this.setStyle("backgroundColor", bgcolor);
}
]]>
</mx:Script>
</mx:Application>
In the HTML page add the following javascript functions:
<script language="JavaScript" type="text/javascript">
function getBGColor()
{
return document.bgColor;
}
function getcss(selector, property)
{
var i, r, s=document.styleSheets && document.styleSheets[0];
if(s)
{
r = s.rules ? s.rules : s.cssRules;
if(r)
{
i = r.length;
while(i--)
{
if(r[i].selectorText.toLowerCase() ===
selector.toLowerCase())
{
return (r[i].style[property]);
}
}
}
}
return null;
}
</script>
--- In flexcoders@yahoogroups.com, "whatabrain" <[EMAIL PROTECTED]> wrote:
>
> How do I make the background color of my flex app match the color of
> the HTML page behind it? It seems that no matter what I do (short of
> setting background color on mx:Application), I get the default blue-
> gray background.
>
> I've tried the following:
> 1) Using the bgcolor parameter and wmode=transparent when creating the
> app.
> 2) Setting backgroundAlpha=0.0 on the mx:Application tag.
>
