Scroll na specifičen element id

10 naročnikov

Vem, da obstaja ogromno tega že spisanega, ampak ne najdem za dotičen primer.

Na vrhu strani želim izpostaviti 4 gumbe (ali linke, ni pomembno), po kliku na določenega pa se seveda stran poscrolla navzdol, na določen naslov.

Button1 na heading id=1
Button2 na heading id=2
Button3 na heading id=3.....

Ima kdo povezavo, nasvet,... Hvala lepa.

http://www.w3schools.com/html/html_links.asp

Narediš enostavno povezavo

<a href="#idElementa">Če klikneš tukaj, te poskroola na element z idjem #idElementa</a>

Na koncu moreš met pa še link z elementom:

<a id="idElementa">Element</a>

Dodaš <a name="ime"..>heading1</a> in linkaš link nan <a href="#ime">gumb</a>

hvala, kako pa bi še dodal malo animacije z javasrciptom oz. jquery.. tam je problem..

Mogoče ti tole kaj pomaga.

http://lions-mark.com/jquery/scrollTo/

to sem tudi že našel, ampak dela samo za naslednji div.. ne vem pa, kako preurediti kodo, da bi delala tudi na način opisan v prvem postu

wssrpnc:
hvala, kako pa bi še dodal malo animacije z javasrciptom oz. jquery.. tam je problem..

Poglej si še demo za ta primer - http://webdesign.tutsplus.com/tutorials/complete-websites/create-a-parallax-scrolling-website-using-stellar-js/.

wssrpnc:
to sem tudi že našel, ampak dela samo za naslednji div.. ne vem pa, kako preurediti kodo, da bi delala tudi na način opisan v prvem postu

Kako to misliš "dela samo za naslednji div"? S tem pluginom targetiraš kar želiš.

Lahko pogledaš ta fiddle prosim pa ga popraviš..

http://jsfiddle.net/WxJLx/4/

Tale fiddle dela čisto pravilno, samo ker je prej konec vsebine ti ne vrže posameznih naslovov do vrha. Sem ti za primer zadnji odstavek še malo nafilal z lorem ipsum in sedaj ti naslovi skočijo po kliku na vrh strani.

edit. še link do fiddla z razširjenim zadnjim odstavkom http://jsfiddle.net/WxJLx/8/

http://jsfiddle.net/WxJLx/9/