Uživatelská okna v JavaScriptu


V HTML toho s okny moc dělat nemůžete, vlastně jenom otevření nového okna. To si ale nemůžete vůbec nadefinovat a proto tady je JavaScript. Tenhle text jsou jenom základy, ale může se to hodit.

Otevření existující stránky v novém okně

Je to asi nejpoužívanější věc. Způsobíte to vyvoláním parametru window.open(). Tvar windo.open je následující:

window.open("URL","název_okna","vlatnosti_okna");


URL je samozřejmě adresa stránky, ať už realtivní nebo absolutní
název_okna charakterizuje název okna, které vytváříte
vlastnosti_okna definují vlastnosti okna. většinou se definuje více vlastností, které se oddělují čárkou bez mezery. Všechny vlastnosti jsou v jedněch uvozovkách. Tady je popis možných vlastností:

Vlastnost Význam Hodnoty
toolbar panel nástrojů (zpět, vpřed...) yes | no
location vstupní pole adresy yes | no
directories divný panel odkazů yes | no
status stavový řádek (dole) yes | no
menubar nabídka (soubor, úpravy...) yes | no
scrollbars rolovací lišty (umožňující posun) yes | no
resizable možnost změny velikosti okna yes | no
width šířka okna v pixelech pixely
height délka okna v pixelech pixely
left vzdálenost levého okraje od okraje obrazovky pixely
top vzdálenost horního okraje od vrąku obrazovky pixely
fullscreen okno bude přes celou obrazovku (fakt přes celou) bez hodnoty



window.open se musí přiřadit k nějaké funkci, např.:

function okno()
{
window.open("test.html","Test","menubar=yes,width=500,height=500,left=50");
}

Pak přidáte k odkazu volání této funkce:

<a href=javascript:okno()>odkaz</a>

nebo

<form>
<input type="button" value="zobraz adresář" onClick="okno()">
</form>


Nové okno bez použití funkce

Nové okno můžete také otevřít bez použití funkce=přímo z odkazu. Funguje to takhle:

<a href="stranka.html" onclick="window.open('stranka.html'); return false">

Po kliknutí na odkaz(onclick) se otevře stránka (stranka.html). Return false zajišťuje, že se neprovede první odkaz, takže se otevře pouze nová stránka a stará zůstane zachována. Kdyby tady return false nebyl, otevřela by se nám stranka.html dvakrát.

Metody manipulace s okny

Metoda moveBy() posouvá oknem o souřadnice.
Metoda moveTo() umístí levý horní roh okna na přesnou souřadnici obrazovky.
Metoda resizeBy() zmenší nebo zvětší velikost okna.
Metoda moveTo() změní velikost okna na přesně zadané velikosti v pixelech.
Metoda scrollBy() odroluje dokument podle zadaných souřadnic (horizontálně, vertikálně). Nahoru se roluje zápornou druhou hodnotou.
Metoda scrollTo() odroluje dokument na přesnou pozici (horizontální, vertikální). Alternativou je metoda scroll().

V praxi to funguje tak, že zadáte metodu a souřadnice, např.:

window.moveBy(100,50)

Všechny souřadnice jsou udávány v pixelech a platí moveBy(horizontálně, vertikálně).

Zavírání okna

Zavření aktuálního okna docílíte pomocí

window.close()

Většina prohlížečů si ale nenechá jen tak zavřít okno. Microsoft Internet Explorer se vás zeptá jestli chcete opravdu zavřít okno, Netscape radši rovnou spadne. Pouze okna otevřená použitím window.open() jdou zavřít bez problémů.

Zavření dříve otevřeného okna

Okno musíte definovat jako proměnou a pak ho zase jako proměnnou zavřít:

proměnná = window.open( ... );
proměnná.close();

Za window.open normálně napíšete vlastnosti okna, a pak ho parametrem .close zavřete.


Tak to je všechno o používání oken, snad alespoň něco použijete.

Hannes