Chris Weber: Probleme mit Divs im IE.

Hallo,

hier erst mal der Sourcecode:

------------------------------

<HTML><HEAD><TITLE>Fliegende Objekte</TITLE>

<style>

.fpunkte
{
position: absolute;
top: -100;
left: 200;
font-family: Arial, Helvetica, sans-serif;
}

</style>

<script>

var delay=20;

function moveit(was, startx, starty, endx, endy, steps, wait)
{
if(wait && wait>0)
  setTimeout('moveit("'+was+'",'+startx+','+starty+','+endx+','+endy+','+steps+','+(wait-1)+')', delay);
else
{
  if(document.layers)
  {
   document.layers[was].left=startx;
   document.layers[was].top=starty;
  }
  else
  {
   document.all[was].style.left=startx;
   document.all[was].style.top=starty;
  }

startx+=(endx-startx)/steps;
  starty+=(endy-starty)/steps;

if(steps>0)
   setTimeout('moveit("'+was+'",'+startx+','+starty+','+endx+','+endy+','+(steps-1)+')', delay);
}
}

function init()
{
if(navigator.appName=="Netscape")
{
  var w=innerWidth;
  var h=innerHeight;
} else
{
  var w=document.body.offsetWidth;
  var h=document.body.offsetHeight;
}

var mw=w/2;  
var mh=h/2;  

moveit("f1", mw-650, -0, mw-512,  0,  30, 30);  
moveit("f2", mw- -650, 0, mw-412,  0,  30, 30);  

moveit("f3", mw-300, 1100, mw-412,  641,  30, 30);
}

</script>

</HEAD>
<BODY onload="init()">

<div id="f4">

<img src="hallo1.gif" width=140 height=30 border=0 alt=""><br><br>
<img src="hallo2.gif" width=140 height=30 border=0 alt=""><br><br>
<img src="hallo3.gif" width=140 height=30 border=0 alt=""><br><br>
<img src="hallo4.gif" width=140 height=30 border=0 alt="">

</div>

<div id="f1" style="position:absolute; top:0; left:-100; width:100; height:741; background-color:#646464;"></div>
<div id="f2" style="position:absolute; top:0; left:1100; width:924; height:645; background-color:#2E2E2E;"></div>
<div id="f3" style="position:absolute; top:1100; left:300; width:924; height:100; background-color:#FF9900;"><div>

</BODY>
</HTML>

----------------------------

Also, da sind 4 DIV-Layer und drei davon, bewegen sich von außerhalb des sichtbaren Bildschirms innerhalb davon, doch der Layer mit den .gif-Bildern verschwindet dann immer hinter den anderen.  Wieso?  Ich hab's schon mit z-index probiert und nicht mal das Verschieben des Bilder-Layers nach den anderen Layern im Code funktionniert.  Wie kann ich es machen, daß der Bilder-Layer nicht hinter den anderen verschwindet?

Danke.

  1. Also, da sind 4 DIV-Layer und drei davon, bewegen sich von außerhalb des sichtbaren Bildschirms innerhalb davon, doch der Layer mit den .gif-Bildern verschwindet dann immer hinter den anderen.  Wieso?  Ich hab's schon mit z-index probiert und nicht mal das Verschieben des Bilder-Layers nach den anderen Layern im Code funktionniert.  Wie kann ich es machen, daß der Bilder-Layer nicht hinter den anderen verschwindet?

    Also ich seh in deinem Quellcose keinen z-index. Wenn Du das konsequent in allen Layern angeben wuerdest, daann waere immer der im Vordergrund, den Du auch haben willst. Ansonsten geht es nach der reihenfolge in der die Layer im Quelltext stehen - wenn ich deine Problem missverstanden hab, dann poste einfach nochmal hier am besten mit einer URL, damit man  sich das mal ansehen kann.

    Viele Gruesse, Thomas Hieck

  2. Hallo Chris!

    Du hast vergessen im 'f3' das <div> zu schließen, ansonsten geht es wie folgt:

    <BODY onload="init()">
    <div id="f1" style="position:absolute; top:0; left:-100; width:100; height:741; background-color:#646464;"></div>
    <div id="f2" style="position:absolute; top:0; left:1100; width:924; height:645; background-color:#2E2E2E;"></div>
    <div id="f3" style="position:absolute; top:1100; left:300; width:924; height:100; background-color:#FF9900;"></div>

    <div id="f4" style="position:absolute; top:0; left:0;">
    <img src="hallo1.gif" width=140 height=30 border=0 alt=""><br><br>
    <img src="hallo2.gif" width=140 height=30 border=0 alt=""><br><br>
    <img src="hallo3.gif" width=140 height=30 border=0 alt=""><br><br>
    <img src="hallo4.gif" width=140 height=30 border=0 alt="">
    </div>
    </BODY>

    Grüße
    Thomas