Hlavná stránka · Diskusné Fórum · Pracovné príležitosti · Zoznam

 Main Menu
o Hlavná stránka
o Zoznam tém
o Zoznam
o Odporučte nás
o Užívatelia
o Vaše konto
o Pridaj článok
o Štatistiky
o Top 10

 Reklama


 Developer Zone's
o Internet
o Tools
o Linux
o CGI Zone
o ASP Zone
o ASP.net
o PHP Zone
o CSS Zone
o JavaScript
o MySQL
o WAP / WML
o WML / WMLScript
o XML / XHTML
o Tipy a triky
o Best of web
o WebServers
o WebDesign
o Grafika

 Servis
o Vyhľadávanie
o Fórum
o Workoffice
o Zoznam článkov
o Reklama
o Pridaj článok
o Pridaj novinku

Napíšte nám
Homepage Do favoritov

 LinkExpres
Interval.cz · Pc.sk
Builder.cz · Mobilmania
PCSvet.cz · Asp.cz
Webdnes · Živě.sk
Zoznam.sk · Atlas.sk
Inzine.sk · PHP.sk
Agent.sk · Lupa.cz
Code.box.sk · Root.cz
Pixel32 · Grafika.cz

 forum.developer.sk
o Fórum ::
o Markup languages
o Scriptové jazyky
o CGI
o PHP/MySQL
o Perl
o Grafika
o Webservery
o HTML Editory
o Browsery
o Bookmarx
o ASP
o Vytvor tému ::

 Pracovné príležitosti
o Ponúkate prácu?
o Hľadáte prácu?

 Autori developer.sk
o Martin Nemeček
o Sväťo Straka
o Jany Masaryk
o Jozef Murín

 
JavaScript [ 23. July 1999] - Martin_Nemecek
Objekt window a práca s oknami v JavaScripte
Otvorenie nového okna v browsery je jednou z dôležitých funkcií JavaScriptu. Taktiež môžte v novom okne naloadovať nový dokument, HTML,TXT, alebo iný.



Máte proste viacero možností ako využiť otvorenie nového okna pomocou JavaScriptu. Na úvodnom príklade si ukážeme ako môžme otvoriť jednoduché okno, nahrať doň HTML stránku a nakoniec ho zatvoriť. Nasledujúci script otvorí nové okno browsera a nahrá doň nasledujúcu HTML stránku:

<html>
<head>
<script language="JavaScript">
<!-- hide

function openWin() {
  myWin= open("pokus.html");
}

// -->
</script>
</head>
<body>

<form>
<input type="button" value="Open new window" onClick="openWin()">
</form>

</body>
</html>

Stránka
pokus.html
je nahrávaná v novom okne pomocou metódy
open()
.

Novootvorené okno v predchádzajúcom príklade sa ničím nelíši od okna browsera v ktorom máte otvorenú napríklad túto stránku. Avšak pri deklarovaní funkcie
open()
sa môžete pohrať s parametrami a prispôsobiť si podľa potreby novootvorené okno. Napríklad si môžete vybrať či novootvorené okno browsera bude mať statusbar, toolbar, alebo menubar. Okrem toho si môžete zvoliť veľkosť okna. Nasledujúci script otvorí nové okno o veľkost 500x350. Okno nebude obsahovať statusbar, toolbar ani menubar.

<html>
<head>
<script language="JavaScript">
<!-- hide

function openWin2() {
  myWin= open("pokus.htm","displayWindow","width=500,
  height=350,status=no,toolbar=no,menubar=no");
}

// -->
</script>
</head>
<body>

<form>
<input type="button" value="Otvor nové okno" onClick="openWin2()">
</form>

</body>
</html>

Všimnite si riadok v ktorom sme definovali premenné o ktorých sme sa bavili pred týmto príkladom a ktoré nám udávajú vlastnosti okna:
"width=500,height=350,status=no,toolbar=no,menubar=no"

Nezabudnite, že v predchádzajúcom riadku medzi jednotlivými hodnotami nesmú byť medzery!

V nasledujúcej tabulke sú vlastnosti okna (window), ktoré môžete využiť:

directories yes|no
height číslo v bodoch
location yes|no
menubar yes|no
resizable yes|no
scrollbars yes|no
status yes|no
toolbar yes|no
width číslo v bodoch

Niektoré nové vlastnosti boli pridané s JavaScriptom vo verzii 1.2 (podporuje napr. Netscape Navigator 4.0 a viac). Nemôžete tieto nové vlastnosti použiť napríklad v Netscape 2.x, 3.x, alebo v Microsoft Internet Explorer 3.x, pretože tieto browsery nevedia interpretovať JavaScript 1.2. V nasledujúcej tabulke sa nachádzajú:

alwaysLowered yes|no
alwaysRaised yes|no
dependent yes|no
hotkeys yes|no
innerWidth číslo v bodoch (replaces width)
innerHeight číslo v bodoch (replaces height)
outerWidth číslo v bodoch
outerHeight číslo v bodoch
screenX pozícia v bodoch
screenY pozícia v bodoch
titlebar yes|no
z-lock yes|no

Pomenovanie, označenie okna

Pri definovaní novootvoreného okna sme použili nasledujúce argumenty:

  myWin= open("pokus.htm", "displayWindow", 
    "width=500,height=350,status=no,toolbar=no,menubar=no");

Ako sa nazýva druhý argument v poradí :
"displayWindow"
, a načo slúži ?

To je označenie, alebo názov okna, ktorý ho jednoznačne identifikuje. Keď poznáme názov existujúceho okna, môžeme doň nahrať www stránku pomocou Anchor :
<a href="pokus.html" target="displayWindow">

Tu práve potrebujeme meno,(označenie) okna.

Zatváranie okna, objekt close()

Otváranie okien pomocou JavaScriptu by sme zvládli, ale čo tak pokúsiť sa o uzatvorenie okna tiež pomocou JavaScriptu. Viem môžete namietať že ste naučený zatvárať okná klasickým krížikom v pravom hornom rohu, a že netreba bádať nad nejakými scriptovými metódami, ale verte, má to niečo do seba. Na uzatvorenie otvoreného okna použijeme metódu
close()
a jednoduchý button pomocou metódy
input
.

<html>
<script language="JavaScript">
<!-- hide

function closeIt() {
  close();
}

// -->
</script>

<center>
<form>
<input type=button value="Zatvor okno" onClick="closeIt()">
</form>
</center>

</html>

Po otvorení nového okna sa v ňom objaví button "Zatvor okno" a po jeho stlačení sa okno uzavrie. Demonštrácia použitia tohto spôsobu uzatvárania okna je vidieť hlavne na reklamných pop-up oknách, ktoré sa otvárajú spolu s načítaním stránky.

Otvorenie odkazu v novom okne

V tomto príklade použijeme funkciu
window.open
. Tento príklad nám ukazuje ako pomocou javascriptu presmerovať odkaz do ďalšieho okna. Zadeklarujeme si na tento účel novú funkciu
makeRemote
.

<html>
<head>
<script language="JavaScript">
<!-- hide

function makeRemote() {
remote=window.open("","remotewin","width=500","height=140");
remote.location.href="menu.html";
if (remote.opener==null)
remote.opener=window;
remote.opener.name="opener";
}

// -->
</script>
</head>

<center>
<h1>Otvorenie odkazu v novom okne.</h1>
<a href="javascript:makeRemote()">Odkaz</a>

</center>

</html>

Vyskúšaj script

 
 Príslušné odkazy k téme
  • Javascript.sk
    Viac o téme: JavaScript | Iné články od: Admin | Pošli komentár | Stránka vhodná na tlač width=15 height=11  Pošli tento článok priateľovi, známemu width=15 height=11


    Najčítanejšie články JavaScript:
    Pulldown menu a tabuľka odkazov

    Ďalšie články v rubrike JavaScript:

  •  

    "Objekt window a práca s oknami v JavaScripte" | Login / vytvor konto | 0 Komentárov
    Prah
    Za obsah komentárov je zodpovedný užívateľ, nie prevádzkovateľ týchto stránok.



    Autorské práva:   ©1999 - 2001 Developer Zone [developer@developer.sk]

    Všetky články sú vlastníctvom autorov Developer Zone. Všetky práva vyhradené. Stránky Developer.sk sú vytvorené pomocou PHP-Nuke.
    Odkazy na nové články je možné preberať pomocou:Backend.php.