Tek-Tips is the largest IT community on the Internet today!

Members share and learn making Tek-Tips Forums the best source of peer-reviewed technical information on the Internet!

Register Log in
  • Congratulations strongm on being selected by the Tek-Tips community for having the most helpful posts in the forums last week. Way to Go!

wmode transparent windows firefox 1

Status
Not open for further replies.
ThomasJSmart

ThomasJSmart

Programmer
Sep 16, 2002
634
I thought flash was browser independent.. apparantly not.
i have a flash movie that works fine in ie 6, ie7, ff apple but not in ff windows.

all browsers have flash player v9. movie is made in v8.

its placed like this (i made the style inline instead of css for easy viewing):

Code: 
<div style="position:absolute;width:100%; height:100%;overflow:hidden;left:-8px; top:-8px;z-index:100;">
<div style="position:relative">
  <object classid="clsid:D27CDB6E-AE6D-11cf-96B8-444553540000" codebase="[URL unfurl="true"]http://download.macromedia.com/pub/shockwave/cabs/flash/swflash.cab#version=7,0,19,0"[/URL] width="1280" height="1000">
      <param name="movie" value="sticky.swf?admin_id=3" />
      <param name="quality" value="high" />
	  <param name="wmode" value="transparent" />
      <embed src="sticky.swf?admin_id=3" quality="high" wmode="transparent" pluginspage="[URL unfurl="true"]http://www.macromedia.com/go/getflashplayer"[/URL] type="application/x-shockwave-flash" width="1280" height="1000"></embed>
  </object>
</div>
</div>

The flash code (shortend somewhat):
Code: 
var DBinteract:LoadVars = new LoadVars();
DBinteract.sendAndLoad("sticky.php", DBinteract, "POST");
DBinteract.onLoad = function(){
	for(n=0;n<DBinteract.total;n++){
		thisId = eval("DBinteract.id"+n);
		thisX = eval("DBinteract.x"+n);
		thisY = eval("DBinteract.y"+n);
		thisInfo = eval("DBinteract.info"+n);
		
		mcObj = attachMovie("stickyMC","stickyMC"+thisId,thisId);
		mcObj._x = thisX;
		mcObj._y = thisY;
		mcObj.sticky_info = thisInfo;
	}
}


the problem in windows firefox is that the alignment is wrong with the buttons and textfields inside the MC thats loaded from the library.

graphically/visually they are all in the right location, but my mouse says that they are 50 pixels or so lower... i.e. if i move the mouse onto where i visually see the button nothing happens, if i move the mouse down the cursor changes to the hand indicating i can activate the button.

I learned a bit yesterday, today i learned a lot, imagine what i'll learn tomorrow!
 
Sort by date Sort by votes
Gave it a try but doesnt seem to be working, cursor/visual is still displaced by 50 pixels or so. also the 'display:none' setting on the holder div is now ignored so the flash is shown on page load instead of being invisible untill a button is pressed

this is the code i used:

Code: 
<script type="text/javascript">
	<!--
		var flashvars = {
			admin_id: "<?=$ADMINid?>"
		};
		var params = {
		  wmode: "transparent"
		};
	
		swfobject.embedSWF("sticky.swf", "sticky", "100%", "100%", "9.0.0","expressInstall.swf",flashvars,params);
		
	//-->
</script>

I learned a bit yesterday, today i learned a lot, imagine what i'll learn tomorrow!
 
Upvote 0 Downvote
this is the shortend version

Code: 
<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Strict//EN" "[URL unfurl="true"]http://www.w3.org/TR/xhtml1/DTD/xhtml1-strict.dtd">[/URL]
<html xmlns="[URL unfurl="true"]http://www.w3.org/1999/xhtml">[/URL]
<head>
<meta http-equiv="Content-Type" content="text/html; charset=iso-8859-1" />
<title>Untitled Document</title>
<style>
	html{
		height:100%; width:100%;
		overflow:hidden;
		margin:0px; padding:0px;
	}
	body{
		height:100%; width:100%;
		background-color:#FFFFFF;
		background-image:url(img/logo_u.jpg);
		background-position:right top;
		background-repeat:no-repeat;
		position:relative;
		overflow:hidden;
		margin:0px; padding:0px;
	}
	
	a,body,div,p,td,input{
		font-size:11px;
		color:#4E2683;
		font-family:Arial;
		font-style:normal;
		text-decoration:none; 
	}
	#wrapper{
		height:100%; width:100%;
		padding-left:10px; position:relative;
	}
	#content{
		background-color:#FFFFFF;
		width:912px; height:100%;
		position:relative;
		overflow:auto;
	}
	#topbar{
		background-image:url(img/topbar.png);
		height:19px; width:918px;
		background-repeat:no-repeat; 
		overflow:hidden;
		text-align:right;
		padding-top:5px;
	}
	#sticky{
		position:absolute;
		width:100%; height:100%;
		overflow:hidden;
		left:-8px; top:-8px;
		z-index:100;
	}
	
</style>

<script type="text/javascript" src="swfobject.js"></script>
<script type="text/javascript">
<!--
function StickyLoader(){
	var Sdiv = document.getElementById('sticky');
	if(Sdiv.style.display=='block'){ Sdiv.style.display='none'; }else{ Sdiv.style.display='block'; }
}
//-->
</script>
</head>
<body>
<div id="wrapper">	
	<div id="topbar"><img src="img/sticky.gif" alt="Sticky notes" title="Sticky notes" onClick="StickyLoader()" style="cursor:pointer" width="16" height="14" /></div>
	<div id="content">lorum ipsum</div>
	<div id="sticky" style="display:none"></div>
	<script type="text/javascript">
	<!--
		var flashvars = {
			admin_id: "<?=$ADMINid?>"
		};
		var params = {
		  wmode: "transparent"
		};
	
		swfobject.embedSWF("sticky.swf", "sticky", "100%", "100%", "9.0.0","expressInstall.swf",flashvars,params);
	//-->
	</script>
</div>
</body>
</html>

I learned a bit yesterday, today i learned a lot, imagine what i'll learn tomorrow!
 
Upvote 0 Downvote
deleted all xept the sticky div: alignment is correct and it works as it should.

started adding divs too see when it broke.. it seems to work fine with everything in except the content div.
i deleted all the content from the content div and its still not working, so deducted it had something to do with the css tag.

Code: 
#content{
	background-color:#FFFFFF;
	width:912px; height:100%;
	position:relative;
	overflow:auto;
}

removed each part of the tag to see which and found that it was the "overflow:auto" thats causing the problem

so i undid all changes in the site, (even putting the flash object right back in the div and not using swfobject)
and only removed the "overflow:auto" from the content div and now it works as intended. anyone care to explain because its lost on me ??? :)

Code: 
#content{
	background-color:#FFFFFF;
	width:912px; height:100%;
	position:relative;
}


I learned a bit yesterday, today i learned a lot, imagine what i'll learn tomorrow!
 
Upvote 0 Downvote
is that the same as the developer toolbar? i have that one..

I learned a bit yesterday, today i learned a lot, imagine what i'll learn tomorrow!
 
Upvote 0 Downvote
i see :) sounds usefull will give it a go,
thanks =)

I learned a bit yesterday, today i learned a lot, imagine what i'll learn tomorrow!
 
Upvote 0 Downvote
thank you K9Logic.
I'm coping with the same problem now in an intranet application.

I'm using draggable windows and have multiple instances of an interactive flash component on a site. I had to set the wmode to transparent because of annoying overlapping of flash objects.
But this caused the same problem - I found the offset of about 130px when I wanted to do some click operations in the flash.

The funny thing is that one of the parent divs of the flash object had overflow:hidden... Changing it to overflow:auto (the case which did not work for you) worked for me...

Maybe because of position:absolute (not relative) I use for the window body div.

:(

But thank you for your investigations.
 
Upvote 0 Downvote
wonderfull how logical webdev is isnt it :D (S.I.)

I learned a bit yesterday, today i learned a lot, imagine what i'll learn tomorrow!
 
Upvote 0 Downvote
Status
Not open for further replies.

Similar threads

BobMCT
  • Locked
  • Question
Why is swf mis-displaying in Firefox 3.x and not IE 8?
Replies
0
Views
54
BobMCT
BobMCT
jacktripper
  • Locked
  • Question
getURL(&quot;javascript:&quot;); not working in FireFox?
Replies
0
Views
68
jacktripper
jacktripper
Cheech
  • Locked
  • Question
Flash Accessibility in Firefox
Replies
0
Views
32
Cheech
Cheech
Gazzieh
  • Locked
  • Question
SWF buttons not working in Firefox
Replies
2
Views
82
Gazzieh
Gazzieh
FlashRasta
  • Locked
  • Question
Trouble with transparent background in Flash 8
Replies
12
Views
149
FlashRasta
FlashRasta

Part and Inventory Search

Sponsor

Back
Top