Fixer Bereich IE
Jürgen
- css
Hallo zusammen,
ich habe mit Hilfe der Erklärung hier bei SelfHtml den Woraround für den fixen Bereich beim IE eingerichtet. Im Inhalts ist eine Flsh-Diashow und ein Bespieltext hinterlegt. Beim Scrollen legt sich nun die Flash Animation über den fixierten Bereich und der Beispieltext wird wie gewünscht unterhalb des fixen Bereichs gescrollt. Das Problem tritt mit Firefox nicht auf, aber mit Opera. Kann mir irgendjemand dabei helfen. Vielen Dank im Voraus, anbei beim bisheriger Code, ansehen kann man sich das ganze auch unter www.beezenpower-schweich.de/index2.shtml.
Gruss Jürgen
<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd">
<html xmlns="http://www.w3.org/1999/xhtml">
<head>
<meta http-equiv="Content-Type" content="text/html; charset=iso-8859-1" />
<meta http-equiv="expires" content="Thu, 22 Feb 2007 20:00:00 GMT" />
<title>BEEZENPOWER-SCHWEICH</title>
<link href="styles2.css" rel="stylesheet" type="text/css" />
<link rel="shortcut icon" href="./favion.ico"/>
<!--[if lt IE 7]><style type="text/css">
@media screen {
html, body {
height: 100%; overflow-y: hidden;
}
#scrollbereich {
height: 100%; width: 100%; overflow: auto;
}
#content {
position: static;
}
}
</style><![endif]-->
</head>
<body>
<div id="banner" style="z-index:4">
<table border=0 cellspacing==0 cellpadding=0 width="100%" bgcolor="#000000">
<tr align=center>
<td align="left" width="80" style="padding-top:5px; padding-left:5px">
<img src="LOGO-JSG_blauschwarz.jpg" alt="LOGO JSG"border=0 height=79 width=80 />
</td>
<td width="100%" align="center">
<img src="schriftzug.jpg" alt="Beezenpower" "width="730" height="80" />
</td>
<td align="right" width="80" style="padding-top:5px; padding-right:5px">
<img src="Tus-Wappen.jpg" height=80 width=64 alt="Tus Wappen" />
</td>
</tr>
</table>
<div id="menue">
<table style="width:100%" border="0" cellpadding="0" cellspacing="0">
<tr bgcolor="#0e1c8e">
<td height="19">
<div align="center"><a class="menue" href="/index.shtml">Home</a></div>
</td>
<td>
<div align="center"><a class="menue" href="/mannschaft.shtml">Mannschaft</a></div>
</td>
<td>
<div align="center"><a class="menue" href="/statistik.shtml">Spielplan</a></div>
</td>
<td>
<div align="center"><a class="menue" href="/spielberichte.shtml">Spielberichte</a></div>
</td>
<td>
<div align="center"><a class="menue" href="/history.shtml">History</a></div>
</td>
<td>
<div align="center"><a class="menue" href="/bilder.shtml">Fotos</a></div>
</td>
<td>
<div align="center"><a class="menue" href="/sportplatz.shtml">Spielstätte</a></div>
</td>
<td>
<div align="center"><a class="menue" href="/hymne.shtml">Hymne</font></a></div>
</td>
<td>
<div align="center"><a class="menue" href="/nachrichten.shtml">Sportnachrichten</a></div>
</td>
<td>
<div align="center"><a class="menue" href="/gbuch.shtml">Gästebuch</a></div>
</td>
<td>
<div align="center"><a class="menue" href="/index.shtml">Kontakt</a></div>
</td>
</tr>
</table>
</div>
</div>
<div id="scrollbereich" style="z-index:1">
<div id="content" style="z-index:1">
<div align="center">
<object classid="clsid:D27CDB6E-AE6D-11cf-96B8-444553540000" codebase="http://download.macromedia.com/pub/shockwave/cabs/flash/swflash.cab#version=7,0,19,0" width="640" height="400" title="diashow">
<param name="movie" value="diashow.swf" />
<param name="quality" value="high" />
<embed src="diashow.swf" quality="high" pluginspage="http://www.macromedia.com/go/getflashplayer" type="application/x-shockwave-flash" width="640" height="400"></embed>
</object>
</div>
<div style="padding-top:50px; color:#FFFFFF">Beispieltext</div>
</dic>
</div>
</div>
</body>
</html>
Styledatei:
html {
background-color:#000000;
padding: 0;
}
body {
background-color:#000000;
margin: 0; padding: 0;
}
#banner {
position: absolute;
}
html>body #banner{ /* nur fuer moderne Browser! */
position: fixed;
}
.menue {
color: #FFFFFF;
text-decoration: none;
font-family: "Comic Sans MS";
font-size: 14px;
font-style: oblique;
font-variant: small-caps;
}
#content {
padding-top:150px;
}
Nachtrag
-> Problem tritt nicht nur mit Opera auf, sonern auch mit IE, einschliesslich IE7
Hi Jürgen,
gib deiem object mal
param name="wmode" value="transparent
Gruß
Antipitch
Hi Antipech,
hat zumindestens mit dem IE geklappt, mit Opera kann ich im Moment leider nicht testen.
Vielen Dank für deine Hilfe.
Schönes Wochende
Gruss
Jürgen
Hallo Antipitch,
leider klappt dein Tipp nicht mit Opera 9.1, IE 7 und unter Linux/KDE klappts zwar mit Firefox, aber nicht mit dem Konqueror. Hast du oder sonst jemand noch einen Tipp für mich.
Merci und Gruss
Jürgen
Hi Jürgen,
gib deiem object mal
param name="wmode" value="transparent
Gruß
Antipitch