Povezave na strani in pozicioniranje pogleda

Uporaba notranjih povezav, sider oz. povezav na strani, da vsebino pozicioniramo na vrhu ekrana/pogleda. V nekaterih primerih, kjer uporabljamo fiksirane glave ali navigacije pa postane to problem, saj slednje zakrivajo vsebino. Z malo CSS iznajdljivosti pa lahko dodamo takšnim povezavam malo več prostora zgoraj, pozicioniranje je tako lepše.

V osnovi lahko povezave sider naredimo tako, da ciljamo element, ki je višje nad želeno vsebino ali pa ustvarimo poseben element le za to funkcijo. Veliko bolje pa je uporabiti le CSS značko »:before«, ki pred želenim elementom ustvari navidezen element, ki služi kot odmik.

Enostavna metoda notranjih povezav z odmikom

#target:before {
content: "";
display: block;
height: 50px;
margin: -30px 0 0;
}

Slabost te metode je ta, da brskalniki potrebujejo ustrezno podporo in ciljani element ne sme imeti ozadja, odmika, ter obrobe.

Na voljo je še nekaj drugih metod, ki se jih lahko ogledate na strani http://nicolasgallagher.com/jump-links-and-viewport-positioning/demo/.

Vir: http://nicolasgallagher.com/jump-links-and-viewport-positioning/

Komentiraj


*