NazajNaprejKazalo

Uvod v JavaScript

3.del


Ogledali si bomo sodelovanje JavaScripta in okvirjev. Za pravilen prikaz okvirjev potrebujete Netscape Navigator ali pa Internet Explorer 3.0, ki hkrati podpirata tudi JavaScript.
Najprej se bomo seznanili z samimi okvirji. Z uporabo okvirjev lahko okno v brskalniku razdelite na ve� delov, ki so med seboj neodvisni. V njih lahko tudi nalo�ite posamezne strani. Dobra stran okvirjev je, da lahko sodelujejo - med seboj izmenjujejo informacije. Lahko bi npr. naredili dva okvirja - v enem bi bila va�a prava stran, v drugem pa menu z ikonami. Menu bi bil vedno viden, v drugem okvirju pa bi se nalagale strani, ki bi jih izbrali s klikom na ikone.
�e si �elite okvirje ogledati, pritisnite gumb:


Zgornji primer:

<HTML>
<HEAD>
<title>Okvirji</title>
</HEAD>
    <FRAMESET ROWS="50%,50%"> 
    <FRAME SRC="frtest1.html" name="fr1"> 
    <FRAME SRC="frtest2.html" name="fr2"> 
  </FRAMESET> 
</HTML>
Najprej z <frameset...> tagom podate brskalniku koliko okvirjev �elite. �e napi�ete rows, boste dobili vrstice, �e pa napi�ete cols boste dobili stolpce. Hkrati lahko uporabite tudi vec <frameset...> tag-ov. Spodaj je primer iz Netscapeove dokumentacije:
<FRAMESET COLS="50%,50%"> 
  <FRAMESET ROWS="50%,50%"> 
    <FRAME SRC="cell.html"> 
    <FRAME SRC="cell.html"> 
  </FRAMESET> 
  <FRAMESET ROWS="33%,33%,33%"> 
    <FRAME SRC="cell.html"> 
    <FRAME SRC="cell.html"> 
    <FRAME SRC="cell.html"> 
  </FRAMESET> 
</FRAMESET>


Najprej naredimo dva stolpca. Prvega razdelimo na dva dela - vsak je velik 50%, drugega pa na tri vrstice - 33%. Okvirjem lahko damo tudi imena, da jih bomo lahko pozneje iz JavaScripta klicali. V prvem primeru smo imena nastavili na fr1 in fr2.
 


Osnove okvirjev smo na hitro preleteli. Oglejmo si naslednji primer:


Odprlo se bo okno, kjer boste s kliki na gumbe lahko spreminjali tekst v drugem okvirju.
Izvorna koda:

Najprej boste rabili frames.html, ki bo naredil okvirje:

<HTML>
<HEAD>
<title>Okvirji</title>
</HEAD>
    <FRAMESET ROWS="50%,50%"> 
    <FRAME SRC="frame1.html" name="fr1" noresize> 
    <FRAME SRC="frame2.html" name="fr2"> 
  </FRAMESET> 
</HTML>
frame1.html:
<HTML>
<HEAD>
<script language="JavaScript">
<!-- Hiding
     function hi() {
       document.write("Zdravo!<br>");
     }
     function yo() {
       document.write("Ziv!<br>");
     }
     function bla() {
       document.write("bla bla bla<br>");
     }
// -->
</script>
</HEAD>
<BODY>
To je na� prvi okvir!
</BODY>
</HTML>
frame2.html:
<HTML>
<body>
To je na� drugi okvir!
<p>
<FORM NAME="Orodjarna">
     <INPUT TYPE="button" VALUE="Zdravo" onClick="parent.fr1.hi()">
     <INPUT TYPE="button" VALUE="Ziv" onClick="parent.fr1.yo()">
     <INPUT TYPE="button" VALUE="Bla" onCLick="parent.fr1.bla()">
</FORM>
</BODY>
</HTML>
Kaj se zgodi? Brskalnik nalo�i prvi html (frames.html), ki kreira okvirje in odpre frame1.html v prvi okvir (ki ima ime 'fr1') ter frame2.html v drugi okvir ('fr2'). V frame1.html so definirane nekatere funkcije, ki pa jih kli�emo iz drugega dokumenta. V drugem dokumentu naredimo skripto in gumbe, ki se navezujejo na funkcije prvega dokumenta. parent.fr1 se navezuje na objektno programiranje. Kot se iz zgornjega primera vidi, frames.html klice frame1.html in frame2.html. frames.html je star� (ang. parent), ostala dva okvirja pa sta otroka. Med okvirji obstaja nekak�na hierarhija. Mogo�e boste la�je razumeli s pomo�jo spodnje skice:
              frames.html                parent - star�
               /      \
              /        \
             /          \
  fr1(frame1.html)     fr2(frame2.html)   children - otroci
Otroci imajo lahko seveda svoje otroke. Ti so nato vnuki ...
              frames.html                star�
               /      \
              /        \
             /          \
  fr1(frame1.html)     fr2(frame2.html)   otrok
          /  \
         /    \
        /      \
    vnuk1     vnuk2                     vnuk
�e ho�ete ozna�iti karkoli v osnovnem parent okvirju iz frame2.html, samo vstavite parent pred funkcijo. Za klicanje funkcij iz frame1.html pa morate zato vstaviti �e fr1 - parent.fr1.

�e ste naredili nekaj okvirjev in nekdo klikne na link, ki je na njih, se tista stran nalo�i v okvir. To je pravilno, �e je tista stran va�a in �e zelite, da se �eljena stran nalo�i v okvir. �e pa ho�e uporabnik slediti povezavi, ki ka�e na neko tretjo stran, bi bilo to neza�eleno. Brskalnik bi za vedno ostal v nekem okvirju! Kako torej izbrisati okvirje?

Enostavno. K va�emu <a href...> tag-u dodajte TARGET="_top". Link nato izgleda takole:

<a href="goaway.html" TARGET="_top">hocem proc od tvojih strani</a>

NazajNaprejKazalo

avtor: �iga Mahkovec
november, 1998