Im HTML-Text unterscheidet sich unser Popup-Fenster kaum vom Rest. Wenn wir wollen, dass es das optisch tut,
dann greifen wir zu Stylesheets. Wir haben unserem Popup-Abschnitt eine Id gegeben: "fensterlein".
Für diese Id können wir im Stylesheet Gestaltungswünsche anmelden. In unserem Falle mache ich das direkt
im <head>-Bereich der Seite, wir brauchen dazu also nicht ein externes Stylesheet anzulegen.
Ich schlage folgende Style-Angaben vor:
<style type="text/css">
div#fensterlein { position: absolute ; top: 1em ; right: 1em ; width: 30em ;
background-color: #F0F5FA ;
padding: 3px ;
border: 3px outset #DFE7EF ;
display: none ; z-index: 2 ;
font-size: 80% ;
}
</style>
div#fensterlein sorgt dafür, dass diese Gestaltungshinweise nur für unser Popup gelten.position: absolute ; top: 1em ; right: 1em ; width: 30em ; background-color und border heben wir es optisch vom Rest
der Seite ab.padding und font-sizesind kleinere ästhetische Korrekturen.display: none sorgt nun dafür, dass das Ganze unsichtbar wird.z-index sorgen wir dafür, dass das Popup — wenn es denn angezeigt wird —
vor den übrigen Text zu liegen kommt. Übrigens ist auch der Hintergrund nicht nur aus optischen
Gründen da, sondern ohne ihn würde der Text durch das Popup durchscheinen.Wenn du mit dem Beispiel von der letzten Seite arbeitest, empfehle ich dir, diese Änderung schon mal vorzunehmen.