CSS: div over SWF

I can not get my div tag to over lap the

Page 1 of 1

7 Replies - 84137 Views - Last Post: 29 April 2009 - 10:26 PM

#1 WMIIII923  Icon User is offline

  • D.I.C Head
  • member icon

Reputation: 1
  • View blog
  • Posts: 101
  • Joined: 10-February 06

CSS: div over SWF

Posted 01 March 2006 - 03:08 PM

I can not get my div tag to over lap the .SWF file embedded in my page.

Here is the code for the CSS:
body {
color: #ff6600;
}

#testing {
position: absolute;
top: 160;
z-index: 1;
}
#hello {
position: absolute;
top: 150px;
z-index: 0;
}


Here is the code for HTML:
<html>
<head>
<link rel="stylesheet" type="text/css" href="format.css">
</head>
<body>
<div id="testing">
hello
</div>
<div id="hello">
<object width="550" height="400">
<param name="movie" value="game.swf">
<embed src="game.swf" width="550" height="400">
</embed>
</object> 

</div>
</body>
</html>

Attached File(s)

  • Attached File  FILE.zip (169.96K)
    Number of downloads: 2819

This post has been edited by WMIIII923: 01 March 2006 - 03:08 PM


Is This A Good Question/Topic? 0
  • +

#5 yeahwhitebear  Icon User is offline

  • New D.I.C Head

Reputation: 2
  • View blog
  • Posts: 16
  • Joined: 02-February 06

Re: CSS: div over SWF

Posted 01 March 2006 - 05:05 PM

To get Content above flash you need to set the WMODE parameter of the Flash Object to 'transparant'

Here is some code to embed Flash. It will validate as XHTML strict and also will replace flash with image if there is no flash player. 

<object type="application/x-shockwave-flash" data="game.swf" width="550" height="400">
	<param name="movie" value="game.swf" />
	<param name="wmode" value="transparent" />
	<img src="game.gif"  width="550" height="400" alt="" />
</object>


Then just add a background-color to you container that holds the flash movie

#hello {
background-color: #000;
position: absolute;
top: 150px;
z-index: 0;
}


All done! Hope this helps
Was This Post Helpful? 1

#6 WMIIII923  Icon User is offline

  • D.I.C Head
  • member icon

Reputation: 1
  • View blog
  • Posts: 101
  • Joined: 10-February 06

Re: CSS: div over SWF

Posted 01 March 2006 - 05:26 PM

The text showed up but the .swf file is not showing up.
Was This Post Helpful? 0
  • +
  • -

#7 yeahwhitebear  Icon User is offline

  • New D.I.C Head

Reputation: 2
  • View blog
  • Posts: 16
  • Joined: 02-February 06

Re: CSS: div over SWF

Posted 01 March 2006 - 05:28 PM

what browser? Do you have latest flash player
Was This Post Helpful? 0
  • +
  • -

#8 yeahwhitebear  Icon User is offline

  • New D.I.C Head

Reputation: 2
  • View blog
  • Posts: 16
  • Joined: 02-February 06

Re: CSS: div over SWF

Posted 01 March 2006 - 05:30 PM

If your flash insert was working then just add wmode attribute

<object width="550" height="400">
<param name="movie" value="game.swf">
<param name="wmode" value="transparent">
<embed src="game.swf" width="550" height="400" wmode="transparent">
</embed>
</object>

Was This Post Helpful? 0
  • +
  • -

#9 Arbitrator  Icon User is offline

  • D.I.C Addict
  • member icon

Reputation: 37
  • View blog
  • Posts: 525
  • Joined: 26-January 05

Re: CSS: div over SWF

Posted 01 March 2006 - 07:56 PM

I tested both versions of yeahwhitebear's code and it works using Flash Player 8 in Firefox 1.5 and Internet Explorer 6.0 SP2 with or without a doctype (I used XHTML 1.1).

Quote

#testing {
position: absolute;
top: 160;
z-index: 1;
}


It might just be a typo but you need to make sure that the distance from the top ("top: 160;") has a measurement specified (pixels: "top: 160px;") which might cause problems. It's also un-necessary to specify a z-index of zero; its value is set to zero by default.
Was This Post Helpful? 0
  • +
  • -

#10 WMIIII923  Icon User is offline

  • D.I.C Head
  • member icon

Reputation: 1
  • View blog
  • Posts: 101
  • Joined: 10-February 06

Re: CSS: div over SWF

Posted 01 March 2006 - 08:05 PM

it works now; thanks.
Was This Post Helpful? 1

#11 mcgeady  Icon User is offline

  • New D.I.C Head

Reputation: 1
  • View blog
  • Posts: 1
  • Joined: 29-April 09

Re: CSS: div over SWF

Posted 29 April 2009 - 10:26 PM

View PostWMIIII923, on 1 Mar, 2006 - 07:05 PM, said:

it works now; thanks.


Are you aware of any workaround when the flash player is version 9? I am using actionscript 3 for an RSS reader, and can't export to flash player 8. Any help would be fantastic, thanks
Mark
Was This Post Helpful? 1
Page 1 of 1