Quelltext der Datei: http://www.michaelster.ch/lernen/daf/loesungen.php

Dateigrösse: 3.41 kb

[Anzeige ohne Zeilennummern]

1 
<!DOCTYPE HTML PUBLIC "-//W3C//DTD HTML 4.01 Transitional//EN">
<html>
    <head>
    <meta http-equiv="content-type" content="text/html; charset=iso-8859-1" />     
        
        <title>Lösungen Papa Moll</title>
        
<style type="text/css">
body    { font: bold 12px verdana,arial,sans-serif; padding:10px; margin:0; color:#fff; background-color:#849dbc; }

#bild_moll    { position: absolute; top: 10px; left: 10px; width: 200px; height: 170px; visibility: visible; display: block; border:1px solid black; }
.moll    { padding:3px; position:absolute; left:10px; top:185px; width:195px; height:80px; background-color:#fff; color:#000; border:1px solid #000; }

<?php
$bild = isset($_GET['bild']) ? $_GET['bild'] : 1;
for($i=1; $i<=8; $i++) {
    if($bild==$i) {
        echo '#test'.$i.' {visibility:visible;}';
    } else {
        echo '#test'.$i.' {visibility:hidden;}';
    }
}
?>
#navi            { padding:1px; position:absolute; left:12px; top:280px; width:210px; color:#fff; background-color:#849dbc; }
#navi a            { color:#fff; margin:0 2pt; padding:0 2pt; }
#navi a:hover    { color:#849dbc; background-color:#fff; text-decoration:none; }
#navi a.active    { color:#ff9900; text-decoration:underline; }

#footer             { margin:0; padding:3px 0; position: absolute; top: 310px; left: 10px; width: 200px; background-color: #fff; color: #849dbc; text-align: center; border-top: 1px solid #000; border-left: 1px solid #000; }
#footer    a        { text-decoration:none; color: #849dbc; font-size: 11px; }
#footer    a:hover    { text-decoration:underline; color: #000; }
</style>
</head>

<body>

<div id="bild_moll"><img src="img/moll-<?php echo $bild; ?>.gif" alt="" width="200" height="170" border="0" /></div>

<div id="navi">
<?php
for($i=1; $i<=8; $i++) {
    $href  = $_SERVER['PHP_SELF'];
    $class = $bild == $i ? 'class="active"' : '';
    $title = 'title="click here"';
    $separator = $i==8 ? '' : '|';
    echo '<td><a ' . $title . ' href="' . $href . '?bild=' . $i . '" ' . $class . '>' . $i . '</a>' . $separator . '</td>';
}
?>
</div>

<div class="moll" id="test1">Mit dem Mann, dem Schiffs-Pilot, steigen sie nun in ein Boot, um den Rheinfall, der so schön, aus der Nähe anzusehen.</div>
<div class="moll" id="test2">Evi sich vornüber beugt und auf kleine Entchen zeigt.<br>Doch dabei hält sie sich nicht und verliert das Gleichgewicht.</div>
<div class="moll" id="test3">'PATSCH!' sie fliegt in hohem Bogen in des Rheines hohe Wogen und die Entlein voller Schreck, fliegen ängstlich schnatternd weg.</div>
<div class="moll" id="test4">Moll, der sofort hilfsbereit, packt die Kleine rasch am Kleid, und der Schiffer hält den Ring, der vorher im<br>Boote hing.</div>
<div class="moll" id="test5">'EVI', sagt Moll sehr empört, solch ein Tun sich nicht gehört. Laut tönt jetzt des Rheinfalls Brausen, Gischt<br>und Wasser abwärts sausen!</div>
<div class="moll" id="test6">Nach dem schönen Augenblick, kehren sie beglückt zurück. Papa Moll zeigt mit der Hand: 'Dort spring ich zuerst ans Land!'</div>
<div class="moll" id="test7">Und man fährt mit frohem Sinn, langsam nun zum Landen hin. Moll nun elegant beschwingt, aus dem Boot zum Ufer springt.</div>
<div class="moll" id="test8">Doch er rutscht, o weh, o Graus! auf der nassen Mauer aus. - und da ihn hier gar nichts hält - PLUMPS! auch<br>er ins Wasser fällt!</div>

<div id="footer">
[<a href="javascript:window.close();">Fenster schliessen</a>]
</div>

</body>
</html>