DIV "scompare" in Firefox (3.5.7)

**@lex!** · 02-02-2010, 11:17

Buongiorno a tutti,
ho dato fondo alle mie conoscenze, ho spulciato Google, questo forum, altri ma non ne sono venuto a capo.
Please, help me!

So che è un problema che probabilmente è già stato trattato ma non ho trovato una soluzione adatta.

Pagina di intro, flash di sfondo a tutto schermo, contenuto in un <div>.
Sopra un piccolo <div> che contiene una semplice tabella con un'immagine.
In IE tutto ok.
In Firefox (3.5.7 e precedenti) si vede perfettamente il <div> col Flash ma non il piccolo <div> soprastante.

Come posso fare?

Ecco il codice:

<!DOCTYPE HTML PUBLIC "-//W3C//DTD HTML 4.0 Transitional//EN" >
<!DOCTYPE HTML PUBLIC "-//W3C//DTD HTML 4.01//EN"
"http://www.w3.org/TR/html4/strict.dtd">
<html>
<head>
<title></title>
<meta NAME="abstract" CONTENT="">

<meta NAME="keywords" CONTENT="">

<meta NAME="description" CONTENT="">

<meta name="robots" content="index, follow">
<meta name="robots" content="all">
<meta name="robots" content="all">

<meta NAME="GoogleBot" Content="no-archive">
<meta NAME="VirgilioBot" Content="no-archive">
<meta NAME="AltavistaBot" Content="no-archive">
<meta NAME="YahooBot" Content="no-archive">
<meta NAME="LycosBot" Content="no-archive">

<meta NAME="Revisit-after" Content="8 days">
<SCRIPT LANGUAGE="JavaScript">
function apriPop(pagina){
var props='width='+screen.width+',height='+screen.heig ht+',top=0,left=0,toolbar=0,menubar=0,location=0,s tatusbar=0,scrollbars=0,resizable=0';
var popup=window.open(pagina,'pop',props);
popup.focus()
}
</SCRIPT>
<link href="style.css" rel="stylesheet" type="text/css" />
<script src="Scripts/AC_RunActiveContent.js" type="text/javascript"></script>
</head>
<body topmargin="0" leftmargin="0" style="overflow: hidden;">
<div style="float:left;clear:both;position:relative;lef t:72%; top:70%;overflow: hidden; z-index:10">
<table width="100" border="0" cellspacing="0" cellpadding="0" bgcolor="#FFFFFF">
<tr>
<td align="center">[img]immagini/logo.jpg[/img]</td>
</tr>
<tr>
<td>[img]immagini/px.gif[/img]</td>
</tr>
<tr>
<td bgcolor="#A6A356" height="20" align="center"><font face="Verdana" size="2" color="#FFFFFF">ENTRA</font></td><br class="clear" />
</tr>
</table></div>
<div id="Layer1" style="overflow: hidden; position:absolute; width:100%; height:100%; z-index:0; left: 0px; top: 0px">

<object classid="clsid:d27cdb6e-ae6d-11cf-96b8-444553540000" codebase="http://fpdownload.macromedia.com/pub/shockwave/cabs/flash/swflash.cab#version=7,0,0,0" width="100%" height="100%" id="intro" align="right">
<param name="allowScriptAccess" value="sameDomain" /></param>
<param name="movie" value="intro.swf" /></param>
<param name="quality" value="High" /></param>
<param name="scale" value="NoBorder"></param>
<param name="wmode" value="transparent" /></param>
<embed src="intro.swf" quality="High" width="100%" height="100%" name="intro" align="middle" allowScriptAccess="sameDomain" type="application/x-shockwave-flash" pluginspage="http://www.macromedia.com/go/getflashplayer" scale="NoBorder" />
</object>
</div>
</body>
</html>

Quoto anche il CSS qualora serva:

@charset "utf-8";
/* CSS Document */
body {
background-color:#000;
}
div.centrato {
display: block;
width: 200px;
height: 100px;
position: absolute;
top: 50%;
left: 50%;
margin: -50px 0 0 -110px;
}
a{
z-index:10px;
text-decoration: none;
font-weight:bold;
color: #ff0000;
}

a:hover{
z-index: 25;
text-decoration: underline;
}

Grazie in anticipo a tutti per l'aiuto e chiedo scusa qualora avessi postatao un problema già trattato.

Saluti.

**alexba64** · 02-02-2010, 11:48

Metti entrambe i livelli all'interno i un container e poi li posizioni facendo riferimento al container stesso

codice:

<div id="Container">

<div id="Flash">
</div>

<div id="Bannerino">
</div>

</div>

**@lex!** · 02-02-2010, 16:27

Grazie Alex però...ahimè non è cambiato nulla!
O meglio, smanettando ad un certo punto il <div> "bannerino" (o "entra" come l'ho chiamato io) è apparso in Firefox ma poi è andato perso nelle modifiche

Posto codice html e css:

HTML

<html>
<head>
<title></title>
<meta NAME="abstract" CONTENT="">

<meta NAME="keywords" CONTENT="">

<meta NAME="description" CONTENT="">

<meta name="robots" content="index, follow">
<meta name="robots" content="all">
<meta name="robots" content="all">

<meta NAME="GoogleBot" Content="no-archive">
<meta NAME="VirgilioBot" Content="no-archive">
<meta NAME="AltavistaBot" Content="no-archive">
<meta NAME="YahooBot" Content="no-archive">
<meta NAME="LycosBot" Content="no-archive">

<meta NAME="Revisit-after" Content="8 days">
<SCRIPT LANGUAGE="JavaScript">
function apriPop(pagina){
var props='width='+screen.width+',height='+screen.heig ht+',top=0,left=0,toolbar=0,menubar=0,location=0,s tatusbar=0,scrollbars=0,resizable=0';
var popup=window.open(pagina,'pop',props);
popup.focus()
}
</SCRIPT>
<link href="style.css" rel="stylesheet" type="text/css" />
<script src="Scripts/AC_RunActiveContent.js" type="text/javascript"></script>
</head>
<body>
<div id="container">
<div id="flash">

<object classid="clsid:d27cdb6e-ae6d-11cf-96b8-444553540000" codebase="http://fpdownload.macromedia.com/pub/shockwave/cabs/flash/swflash.cab#version=7,0,0,0" width="100%" height="100%" id="intro" align="right">
<param name="allowScriptAccess" value="sameDomain" /></param>
<param name="movie" value="intro.swf" /></param>
<param name="quality" value="High" /></param>
<param name="scale" value="NoBorder"></param>
<param name="wmode" value="transparent" /></param>
<embed src="intro.swf" quality="High" bgcolor="#000" width="100%" height="100%" name="intro" align="middle" allowScriptAccess="sameDomain" type="application/x-shockwave-flash" pluginspage="http://www.macromedia.com/go/getflashplayer" scale="NoBorder" />
</object>
</div>
<div id="entra">
<table width="100" border="0" cellspacing="0" cellpadding="0" bgcolor="#FFFFFF">
<tr>
<td align="center">[img]immagini/logo.jpg[/img]</td>
</tr>
<tr>
<td>[img]immagini/px.gif[/img]</td>
</tr>
<tr>
<td bgcolor="#A6A356" height="20" align="center"><font face="Verdana" size="2" color="#FFFFFF">ENTRA</font></td>
</tr>
</table></div>
</div>
</body>
</html>

CSS

@charset "utf-8";
/* CSS Document */
body {
top:0;
left:0;
background-color:#000000;
overflow: hidden;
}
#container{
overflow: hidden;
position:absolute;
width:100%;
height:100%;
left: 0px;
top: 0px
}
#flash{
overflow: hidden;
position:absolute;
width:100%;
height:100%;
z-index:0;
left: 0px;
top: 0px
}
#entra{
position:relative;
left:72%;
top:70%;
z-index:5;
}
a{
z-index:10px;
text-decoration: none;
font-weight:bold;
color: #ff0000;
}
a:hover{
z-index: 25;
text-decoration: underline;
}

Aiuto! :master:

**alexba64** · 02-02-2010, 16:37

Dai le altezze non in percentuale e poi vediamo

**@lex!** · 02-02-2010, 16:45

non cambia nulla

**@lex!** · 02-02-2010, 17:16

ho fatto delle prove e se ad esempio, al posto del flash, metto un'immagine di sfondo qualsiasi, in Firefox il <div> "entra" si vede.

Quindi ho idea sia un problema del Flash.

Quindi la domanda ora è:
Qualcuno sa dirmi come far vedere in Firefox un <div> che contiene una semplice immagine sovrapposto ad un <div> di sfondo che contiene un Flash?

Ribadisco che in IE vedo tutto ok.

Quali parametri cambiare? Cosa devo aggiungere/togliere (suppungo nell'embed)?

Grazie a tutti.

**mucu** · 02-02-2010, 17:23

il codice del flash contiene sintassi html e xhtml
decidi quale usare e corregi

**alexba64** · 02-02-2010, 17:25

Originariamente inviato da mucu
il codice del flash contiene sintassi html e xhtml
decidi quale usare e corregi

se vogliamo essere pignoli anche l'embed dovresti eliminarlo

ps: metti online sta pagina che la vediamo

**@lex!** · 02-02-2010, 17:30

Risolto con questo tutorial
http://css.flepstudio.org/css-tutori...ndo-flash.html
e andando a modificare il campo "position" delle classi

@charset "utf-8";
/* CSS Document */
body {
top: 0px;
left: 0px;
background-color: #000000;
overflow: hidden;
}
#container{
overflow: hidden;
position:relative;
width:100%;
height:100%;
left: 0px;
top: 0px;
}
#flash{
color:#FFFFFF;
overflow: hidden;
position:relative;
width:100%;
height:100%;
z-index:0;
left: 0px;
top: 0px;
}
#entra{
width:144px;
position: absolute;
left: 72%;
top: 70%;
z-index: 5;
}
a{
z-index: 10px;
text-decoration: none;
font-weight: bold;
color: #ff0000;
}
a:hover{
z-index: 25;
text-decoration: underline;
}

Grazie a tutti per l'aiuto!!!

Discussione: DIV "scompare" in Firefox (3.5.7)

Strumenti discussione

Ricerca discussione

Visualizza

DIV "scompare" in Firefox (3.5.7)

Permessi di invio