David: /CSS: IE-Problem mit Event-Handlern in Verbindung mit CSS

Beitrag lesen

<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Strict//EN"
     "http://www.w3.org/TR/xhtml1/DTD/xhtml1-strict.dtd">
<html xmlns="http://www.w3.org/1999/xhtml" xml:lang="de" lang="de">
<head>
    <meta http-equiv="content-type" content="text/html; charset=utf-8" />
    <meta http-equiv="content-style-type" content="text/css" />
    <meta http-equiv="content-script-type" content="text/javascript" />

<title>Test</title>

<style type="text/css" media="screen">
        body {
            margin:0;
            padding:4em 6em;
        }
        .wrapper {
            height:1%;
        }
        .container {
            margin:2em 0;
            background:#eee;
            border:1px #000 solid;
        }

h2, p {
            margin:0;/* 1em 2em; */
            padding:1em;
        }
    </style>
 <script>
  function makeBgDark(e) {
   document.getElementById('c1').style.backgroundColor = '#ccc'
  }
  function makeBgLight(e) {
   document.getElementById('c1').style.backgroundColor = '#eee'
  }
  function init() {
   document.getElementById('c1').onmouseover = makeBgDark;
   document.getElementById('c1').onmouseout = makeBgLight;
  }
 </script>
</head>
<body onload="init()">
    <div>
        <div id="c1" class="container">
            <h2>Event-Handler und IE(6)</h2>
            <p>
                In diesem Beispiel soll sich die Hintergrundfarbe des DIVs .container per
                JavaScript aendern, wenn man ihn mit der Maus ueberfaehrt.
            </p>
            <p>
                Bist Du hiermit zufrieden?
                Viele Grüße
                David
            </p>
        </div>
    </div>
</body></html>