Evo zgodnog rješenja kada imate poveći broj linkova koji vam zauzimaju mjesto na blogu, a ne zahtijevaju dodatan opis. Možete ga koristiti za linkanje svoje arhive postova, ili ako pratite mnogo blogova... Da bi izbornik radio, korisnik mora imati uključen JavaScript, a to velika većina korisnika ima.
Pojašnjenje koda: Imamo formu imena formular. U njoj se nalazi izbornik (selector) koji smo nazvali izbornik. Nižemo vrijednosti u izborniku, tako da se između tagova < option > i < /option > nalazi ime koje će biti prikazano, a u value="" upišemo link do kojeg će voditi ta opcija.
Klikom da gumb Kreni! pokrenuti će se JavaScript i u prozoru će se otvoriti nova stranica.
Evo izbornika prikazanog gornjim kodom:
No, to se sve može i ljepše i bolje, pa onaj tko je za malo naprednog oblikovanja, neka čita dalje :)
Primijetite da opcije korisni linkovi, blogovi i linkovi imaju value=none što znači da se njihovim odabiranjem neće dogoditi ništa. Opcija linkovi je označena sa selected što znači da će pri učitavanju izbornika ta opcija biti predložena u prozorčiću izbornika. Opcijama korisni linkovi i blogovi dala sam klasu grupa kako bi im u CSS-u dala posebno oblikovanje. Tako možemo prividno podijeliti izbornik u više grupa linkova. Opciji linkovi sam dala id, također kako joj mogla pristupiti CSS-om. Vidjet ćete kako.
Naravno, evo i CSS-a. Mijenjanjem vrijednosti boja, veličina i fontova napravite svoj originalni izbornik :)
Primjećujete li kako nakon otvaranja izbornika opcija "linkovi" nestane? To je napravljeno pomoću display: none u CSS-u. Klasa grupa ima oblikovanje kako bi se razlikovala od pravih linkova.
Evo, to je bilo to :) Jednostavno, zar ne?