| Autor | Zpráva | ||
|---|---|---|---|
| Mlocik97 Profil * |
Dobrý deň,
potreboval by som vytvoriť toto 
když kliknete na šipku aby stránku prescrollovalo nahor avšak takým spôsobom že stránka má rozloženie hlavička 100px od hora pak je menu (nav-bar), ktorý po skrollingu dole sa ukotví na vrh stránky, (position: fixed) a pak sa scrolluje len obsah, a ja potrebujem pomerne zložitý scrolling, chci aby když ste napríklad na konci stránky a klepnete na to tlačítko tak začalo skrolovať stránku a postupne (animáciou) aby scrollovanie zrýchlovalo, od polky začalo spomalovať pred "odkotvením nav-bar" na velmi krátku chvílu scrollovanie "pozastalo" alebo prudšie nachvílu spomalilo a potom znova kus zrýchlilo, a následne postupne spomalovalo až sa zastaví na úplnom vrchu. Celá animace scrollingu by mala trvať tak ideálne aby to nebolo dlhé ani rýchle, asi tak cca 1.5-2 sekundy (môj odhad) obsah bude maximálne do 200 riadkov klasického textu takže když má tolko preskrolovať neviem jak odhadnuť ani čas aby uživatel nemusel tolko čakať a zároveň to nebolo príliš rýchle... neviete ako napísať taký kód? viem že tam bude vela javascriptu. Mlocik97: p.s. a jak bych mohl vykresliť ten button cez CSS? Mlocik97: chci samozrejme aby sa rýchlosť scrollingu menil plynule... Mlocik97: jo a ešte dodám jedná sa o 3 stĺpcový layout, prostredný sa len "scrolluje" a prvok (to tlačítko bude) umiestnené na spodok pravého stĺpca. Mlocik97: a ešte dodám, když je stránka nascrollovaná hore, tak by tlačítko malo byť skryté, a pri preskrolovaní 150px dole by sa malo tlačítko animovane objaviť (spôsobom že sa postupne tam zostilný jeho obraz, jako "presvitaním". až nakoniec tlačítok nebude vôbec presvitať a postupne obraz pod ním nebude vidieť,. a absolutne nepresvitavé (100% prekrytie) by malo nastať tiež ešte neviem ale asi pri prescrollovaní o 200px. |
||
| Chamurappi Profil |
Reaguji na Mlocika97:
„od polky začalo spomalovať pred "odkotvením nav-bar" na velmi krátku chvílu scrollovanie "pozastalo" alebo prudšie nachvílu spomalilo a potom znova kus zrýchlilo, a následne postupne spomalovalo až sa zastaví na úplnom vrchu“ Koukám, že to máš detailně promyšlené. Ale než ti poradím, jak si máš napsat vela javascriptu, zkus se prosím zamyslet… Ty jako uživatel na podobné šipky někdy klikáš? Mně většinou jen zaclání a kradou pozornost (zejména, pokud se animovaně zobrazují/skrývají)… a řeknu-li si, že chci dojet nahoru, tak si tam dojedu ručně sám a hned, než abych věřil nějakému kdovíjak udělanému čudlíku na webu. Podle mých měření nejsem sám, na podobné šipky klikají lidi jen u velmi vysokých stránek na mobilech, jinak jsou to spíš kliknutí omylem… Kdybys podobné tlačítko na webu neměl, dovedeš si představit, že uživatel na stránce zůstane odrolovaný dole a nebude vědět, jak se dostat k hlavičce? Nebo že ho nenapadne možnost odrolovat nahoru? Nebo že ho napadne „uf, to je ale fuška, škoda, že tu na vyrolování nahoru nemají předpřipravenou šipku“? „pak je menu (nav-bar), ktorý po skrollingu dole sa ukotví na vrh stránky, (position: fixed)“ Pokud je navigace dostupná trvale, jaký by měl být motiv návštěvníka k rolování nahoru? „aby to nebolo dlhé ani rýchle, asi tak cca 1.5-2 sekundy (môj odhad) obsah bude maximálne do 200 riadkov klasického textu“ Na FullHD vidím nějakých 66 řádků textu najednou, takže kdybych sledoval sekundu a půl, jak se mi obraz posouvá nahoru o dvě obrazovky, asi bych litoval, že jsem na to tlačítko klikal. |
||
| Mlocik97 Profil * |
#3 · Zasláno: 26. 12. 2016, 12:15:20
Chamurappi:
chcel som radu nie poučenie,.. a ja šipku na scrollovanie používam furt, hlavne na webu eune.leagueoflegends.com/cs v prípade patch notes a pár dalších vecí... samozrejme oni nemajú ukotvené menu. To avšak chci z kus jiného dôvodu než prístup k menu. tie časy OK, možno som prestrelil, bol to iba odhad, a neviem komu sa zobrazuje kolko textu na monitore, to som nikdy ani nad tým nepremýšlal, iba teraz a jak uvažuju toto ti dám za pravdu, ale samozrejme čas sa dá vždy upraviť, stačí mi kód.. |
||
| Michales Profil |
#4 · Zasláno: 26. 12. 2016, 12:41:52
Tady od tohoto se můžeš odpíchnout:
$("a[href='#bottom']").click(function() {
$("html, body").animate({ scrollTop: $(document).height() }, "slow");
return false;
}); |
||
|
Časová prodleva: 7 let
|
|||
0