Üzenetablak (dialog)
Az Üzenetablak lényege, hogy valamilyen aktuális rövid információt jelenítsünk meg a felhasználónak. Például valamilyen választást adhatunk neki, vagy eldöntés elé állíthatjuk, vagy egyszerűen csak kiírunk neki valamit. Illetve, miután elolvasta az üzenetet a felhasználó, bezárhatja az ablakot.
A szükséges állományok: ui.dialog.js, ui.draggable.js (hogy mozgatható legyen az ablak), dialog.css
Használata
Készítsünk egy div-et, melynek az id-je legyen example, az osztálya legyen flora. Definiáljuk a title attribútumát! Itt adjuk meg az ablak címsorába írandó szöveget. A div-en belülre kerül a doboz szövege. A css-ben módosíthatjuk a doboz külsejére vonatkozó beállításokat.
Forráskód
HTML
A head-ben hívjuk meg a szükséges fájlokat!
<script type="text/javascript" src="js/ui.dialog.js"></script>
<link rel="stylesheet" href="css/dialog.css" type="text/css" media="screen" />
<link rel="stylesheet" href="css/draggable.css" type="text/css" media="screen" />A body-ban a következő kódrész szükséges.
<div id="example" class="flora" title="Ablak fejléce">Ide meg a szöveg jön. <br /><br />
Ez akár lehet több soros is. De ha túlfut az ablak méretén, akkor nem fog látszani a lelógó szöveg.
Ilyenkor változtassuk meg az ablak méreteit!</div>CSS
A css-ben állíthatjuk be a színeket, a háttereket, kurzort, méretet.
Példa
Ez akár lehet több soros is. De ha túlfut az ablak méretén, akkor nem fog látszani a lelógó szöveg. Ilyenkor változtassuk meg az ablak méreteit!