S designem oblasti úryvků „hotovo“ - nyní můžeme přejít k nějaké interaktivitě (čtěte: JavaScript).
Přidali jsme super chromé převrácení odkazů vlevo, abychom něco měli, ale víme, že to později změníme. Pak jsme se pustili do psaní nějakého JavaScriptu. Při první návštěvě stránky bude aktivní první kategorie (HTML). Aktivní, což znamená, že má v položce seznamu pro HTML třídu „aktivní“. CSS ovlivňuje tuto třídu a dává jí hodnotu z-indexu, která vizuálně zvedne odkaz nad stín a připojí jej k plné barevné čáře oddělující dva sloupce.
Trik bude, když kliknete na jinou kategorii, abyste odstranili aktivní třídu v aktuálně aktivní kategorii a použili ji na nově kliknutou kategorii. Je to opravdu triviální, jen pár řádků jQuery ve skriptu, který načítáme pouze na této stránce. Seznam úryvků v pravém sloupci také musí ukázat správnou sadu odkazů, což je opět jen změna třídy a jednoduchá manipulace se zobrazením / skrytím.
Nyní zbývá jen upravovat stránky pro jednotlivé úryvky.