Šta je novo?

Naziv scroll efekta

CRooY3

Poštovan
Učlanjen(a)
18.08.2017
Poruke
20
Poena
54
OK, iako mi uvijek govore da ne postoje glupa pitanja, ovo je možda malo glupo pitanje.

Gledam ovu stranicu: http://simpluiwp.themeroasters.com/

I sad, kada scrollate prema dolje, dijelovi web stranice kao da se izvršuju tijekom tog scrolla. Hoću reći, nisu statični nego kao da se pojavljuju dok se scrolla. Jel netko zna kako se zove taj ekeft. Tražim primjere koda za to na webu i nikako da nađem. Mislim da bi mi puno pomogao naziv tog efekta, naravno ako naziv za to postoji...


P.S. Postoje li neki domaći forum koji su namjenjeni programiranju, posebice jezici za izradu weba i web aplikacija...

Znam da je bio programiranje.org, ali nije bio pretjerano aktivan i koliko vidim sada su ga ugasili
 
Ima tu vidim da je neko pitao pa da ne filozofiram sam.

https://stackoverflow.com/questions...n-user-scroll-to-specific-element-with-jquery

Koristiš scroll event i visinu da znaš kad je scrollovano do tog elementa, imaš u drugom odgovoru DEMO.

http://jsfiddle.net/n4pdx/

Može se to i ljepše napisati, ako bude trebalo napisaću ja, uglavnom jQuery je u pitanju ali može se uraditi i bez njega, samo javascript.

Ovo što se elementi pomjeraju, zumiraju i slično je samo efekat ili transformacija koju odradiš kad je taj event "triggerovan".
 
Poslednja izmena:
P.S. Postoje li neki domaći forum koji su namjenjeni programiranju, posebice jezici za izradu weba i web aplikacija...

Imas ovaj, slobodno pisi i pitaj sta te zanima, imamo dobre strucnjake koji su malo stidljivi te treba biti strpljiv :)
 
@mrtavker ok, sad si mi bar dao ideju kako bi se to dalo izvesti. Još uvijek ne znam kako ću to točno napraviti, ali barem mi je početna ideja tu pa sad imam oko čega "mozgati".

@DukeLander izgleda da ćemo se onda dosta družiti :D
 
Dobrodosao :)
 
Sredio sam neku beta verziju ovoga što me zanimalo uz kod koji sam našao na onom linku. Ono što me i dalje muči je razumijevanje tog jQuery koda, tj. što bi svaka od ove četiri linije koda značila

Kod:
var hT = $('#scroll-to').offset().top,
hH = $('#scroll-to').outerHeight(),
wH = $(window).height(),
wS = $(this).scrollTop();

Cijeli primjer je ovdje. Ostatak jQuery koda mi je poznat, ali ove četiri linije mi stvaraju problem. Također, tu sam malo eksperimentirao s tim da se boxevi opet maknu kad se scrolla još dolje, ali sam došao do toga da se boxevi maknu prerano, a čini mi se i da se pojavljuju prekasno.
https://jsfiddle.net/CRooY3/7m6edm0o/
 
offset - vraća koordinate elementa, dakle objekat koji ima atribute top i left. Dakle offset().top će ti dati vrijednost gdje se nalazi taj element u odnosu na vrh dokumenta.

outerHeight - funkcija vraća visinu elementa uključujući padding, margine, border i šta god od tog imalo.

height - vraća visinu elementa, bez ovih dodatnih vrijednosti, dakle ako je visina dokumenta 1080px, vratiće ti vrijednost 1080.

scrollTop - jednostavno objašnjeno, broj piksela koje si preskrolovao, odnosno dio stranici koji se ne vidi jer si ga prešao skrolom (broj piksela iznad skrola). Tipa ako na stranici nemaš skrol i sve stane u "view" ta vrijednost će biti nula, a ako ti je recimo visina pregledača 1000 piksela, visina cijelog sadržaja 1300 i ti kad bi doskrolao do dna stranice scrollTop bi trebalo da vrati 300. Naravno to se odnosu na slučaj da pozivaš funkciju nad prozorom iliti window elementom zato sam svo vrijeme spominjao "stranica", to se može odnositi i na element.

Napravio sam fiddle pošto kontam da objašnjenje nije baš najsrećnije za ovaj zadnji slučaj. Otvori konzolu i vidjećeš da kad pritisneš prvi button dobiješ vrijednost 0 jer je scroll na vrhu, kad pritisneš drugi dobićeš neku vrijednost, a ovaj button skroz na dnu dobijaš maksimalnu vrijednost.

https://jsfiddle.net/serjuice/L25mmqz4/
 
Poslednja izmena:
Aha, u tom slučaju mi ona if petlja nema smisla, ali prepravio sam ju tako da radi ono što želim

Hvala na pomoći
 
Nazad
Vrh Dno