Úvod a cíle

Hypertextový modul: Odkazy na konkrétní místo na stránce

Odkazy nemusí směřovat jen na jinou stránku či soubor, ale mohou též odkazovat na konkrétní místo na stránce. Takovéto použití odkazů je praktické především v případě, kdy je na jediné stránce obsaženo velké množství informací, často v podobě dlouhého textu. Pokud vás zajímá jen určité téma v textu, tak namísto zdlouhavého procházení celé stránky jednoduše klepnete na odkaz, který vás přenese na žádané místo na stránce.

K označení místa, kam prohlížeč po klepnutí na odkaz "skočí", se používá obecného atributu id.

Představte si, že jste své stránky rozdělili do čtyř hlavních oddílů, z nichž každý začíná nadpisovým prvkem h1. Přiřazením atributu id každému z nadpisů je tímto způsobem jedinečně označíte.

Například takto:

<h1 id="prvni">První nadpis</h1>

<h1 id="druhy">Druhý nadpis</h1>

<h1 id="treti">Třetí nadpis</h1>

<h1 id="ctvrty">Čtvrtý nadpis</h1>

K vytvoření odkazu, který vás vezme na místo, kde se nalézá dané id, opět použijeme náš známý prvek odkazu a, ovšem hodnotou atributu href bude v tomto případě žádané id, jemuž předchází znak #.

Například:

<a href="#druhy" title="druhý nadpis">Odkaz na druhý nadpis</a>

Po klepnutí na tento odkaz bude návštěvník "přenesen" na místo na stránce, kde se nalézá druhý nadpis bez toho, aby se k němu musel pracně "dorolovat" (pokud to lze, po klepnutí na odkaz se prohlížeč se nastaví tak, aby zobrazil odkazované místo na začátku zobrazované části stránky).

Ukázka hypertextových odkazů odkazujících se na konkrétní místa na téže stránce je uvedena v příkladu . Prohlédněte si příklad a ověřte si, jak funguje. Poté pod každý nadpis umístěte odkaz, který bude směřovat zpět na začátek stránky.

Návrh řešení:

• Na začátek stránky (hned za počáteční značkou prvku body) vložte odstavec a přiřaďte mu atribut id. Např. <p id="zacatek">Zde začíná stránka </p>
• Do každého odstavce nalézajícího se hned za nadpisem vložte odkaz, odkazující se na začátek stránky. Např. <a href="#zacatek" title="začátek">Zpět na začátek stránky</a><br />

Odkaz na konkrétní místo na jiné stránce

Původní stránka s nadpisy v příkladu se jmenuje stranka_s_nadpisy.htm. Pokud se chceme na jednotlivá místa na této stránce odkazovat z jiné stránky, připíšeme do hodnoty href před křížek a dané id ještě adresu stránky.

Ukázka odkazů na konkrétní místa na jiné stránce je uvedena v příkladu . V tomto příkladu se odkazujeme na konkrétní místa stránky z předchozího příkladu (stranka_s_nadpisy.htm). Stránka, ze které se odkazujeme, se nalézá ve stejné složce jako stranka_s_nadpisy.htm.

Odkazovat se na konkrétní místo na stránce lze samozřejmě i pomocí absolutních odkazů. Například:

<a href="http://www.vymyslena_domena.cz#id"

title="konkrétní místo">

absolutní odkaz na konkrétní místo na jiné stránce

</a>