Kurz HTML – rámce a odkazy v nich

19. července 2000

•

Vážení čtenáři, v minulém díle jsem se zmínil o základech rámů. V tomto díle budu psát o pojmenování jednotlivých oken v rámu a o tom, jak správně psát odkazy mezi nimi.

Pokud píšete svoje stránky, a rozhodli jste se používat rámy, zjistili jste, že každé jednotlivé okno v rámu se chová dost samostatně. Pokud se speciálně nepostaráte, tak veškerá kliknutí na odkaz se dějí jenom v jednom okně. A přitom je mnohokrát potřeba, aby třeba po kliknutí na obrázek se změnilo jiné okno.

Abychom mohli překročit hranice oken v rámech, je potřeba každé okno pojmenovat. To se provádí pomocí atributu name při definici rámů. Uvedu příklad rámů s levým a pravým oknem. Levé okno se bude jmenovat "left" a pravé okno "main":

<html>
<head>
<title>Nadpis mého webu</title>
</head>
<frameset cols="150,*">
<frame name="left" src="leva_cast.html">
<frame name="main" src="uvodni_cast.html">
</frameset>
</html>

Pokud máte jednotlivá okna pojmenována, pak je to jednoduché. Řekněme, že budete chtít třeba mít v levém okně seznam odkazů. Ale přejete si, aby po kliknutí na odkaz se změnilo pravé okno. To lze zařídit snadno, pokud (předpokládám definici rámů jako příklad výše) levé okno bude v souboru leva_cast.html obsahovat podobný kód:

Princip je ten, že použijete v odkaze (tedy ve značce <a>) atribut target (což v angličtině znamená cíl). Pomocí atributu target můžete odkaz zacílit do libovolného okna. V příkladě jsou odkazy zacíleny do okna main, tedy do pravé části.

Můžete chtít ještě další chování odkazů v rámcích. Například můžete chtít mít odkaz, který po kliknutí zruší rámce, a zobrazí novou stránku jako jedno okno. To lze snadno zařídit, pokud použijete speciální jméno _top. Takže pokud napíšete odkaz takto, otevře se po kliknutí na poslední odkaz úvodní strana Intervalu.cz bez rámů (lze vyzkoušet ve výše uvedeném zazipovaném příkladu):

<html>
<head>
<title>Levé menu</title>
</head>
<body>
<center>
<a target="main" href=“uvod.html“>Úvod</a> 
<a target="main" href=“uvod.html“>Text</a> 
<a target="_top" href=“http://www.interval.cz“>Interval</a> 
</center>
</body>
</html>

Někdy je trochu otravné neustále vypisovat ke všem odkazům atribut target. Třeba můžete mít na stránce dvacet odkazů, které všechny cílí do stejného okna. Potom můžete s výhodou použít značku <base>. Řekněme, že v levé části budou všechny odkazy mířit do okna main. Potom stačí napsat do hlavičky HTML stránky (tedy mezi <head> a </head>) příkaz <base target="main"> a je po starostech. Například výše uvedený příklad lze přepsat také takto, bude pracovat naprosto stejně:

<html>
<head>
<title>Levé menu</title>
<base target="main">
</head>
<body>
<center>
<a href=“uvod.html“>Úvod</a> 
<a href=“uvod.html“>Text</a> 
<a target="_top" href=“http://www.interval.cz“>Interval</a> 
</center>
</body>
</html>