Jürgen: Fixer Bereich IE

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&auml;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&auml;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;

}

  1. Nachtrag

    -> Problem tritt nicht nur mit Opera auf, sonern auch mit IE, einschliesslich IE7

    1. Hi Jürgen,

      gib deiem object mal

      param name="wmode" value="transparent

      Gruß
      Antipitch

      1. 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

      2. 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