jQuery animácie - plynulosť

Programovacie jazyky, rady, poradňa...
scriptType
Medium Expert
Medium Expert
Používateľov profilový obrázok
Príspevky: 110
Registrovaný: 22 feb 2011, 19:34

jQuery animácie - plynulosť

Príspevok od používateľa scriptType »

Zdar kolegovia,

riešim problém s plynulosťou animácií v jQuery. Ide o animáciu kde sa nejaký obrázok hýbe hore a dolu, dokola. No animácia mi príde roztrasená, nejde plynule, ako keby nedostatočný framerate.

Skúšal som aj optimalizovať kód, aby sa napr. volanie na element ne-uskutočnovalo 2* - využitie $(this) aby to bolo rýchlejšie keď ide o milisekundy, ale stále je rovnaký výsledok.
Momentálne to vyzerá takto:

Kód: Vybrať všetko

function loop() {
        
     $('.animate-arrow').animate({
         top: '+=10',
     }, 700, 'linear').promise().done(function () {
         $(this).animate({
             top: '-=10'
         }, '600', 'linear').promise().done(loop);
     });
 }
Máte niekto náhodou skúsenosť s animáciami, prípadne ako ste riešili aby to bolo plynulejšie - bez využitia Flash a swf a iných podobností. Odporučenie nejakej knižnice alebo niečoho podobného :) Ďakujem pekne.
mjz
Medium Expert
Medium Expert
Používateľov profilový obrázok
Príspevky: 134
Registrovaný: 25 nov 2007, 14:20
Bydlisko: Bardejov

Re: jQuery animácie - plynulosť

Príspevok od používateľa mjz »

Toto som raz davnejsie pouzil na nejaku drobnost a bolo to lepsie, plynulejsie
http://julian.com/research/velocity/
audiotrack
VIP
VIP
Používateľov profilový obrázok
Príspevky: 25958
Registrovaný: 09 sep 2005, 18:39
Kontaktovať používateľa:

Re: jQuery animácie - plynulosť

Príspevok od používateľa audiotrack »

css3
sharky-no
King
King
Používateľov profilový obrázok
Príspevky: 1681
Registrovaný: 31 okt 2006, 19:53

Re: jQuery animácie - plynulosť

Príspevok od používateľa sharky-no »

tak ako pise audio. a navyse pouzit namiesto top atributu transform: translateY(10px) ... to ti zaruci peknu plynulu animaciu

zdroj:
http://www.paulirish.com/2012/why-movin ... s-topleft/
scriptType
Medium Expert
Medium Expert
Používateľov profilový obrázok
Príspevky: 110
Registrovaný: 22 feb 2011, 19:34

Re: jQuery animácie - plynulosť

Príspevok od používateľa scriptType »

Díky chalani,

vyskúšal som aj Velocity.js na môj problém ako poradil "mjz" a fungoval super, ale čo sa dá riešiť cez CSS, radšej CSS a tak som si rovno pozrel podporu prehliadačov CSS 2D transform a veľmi slušné, od IE9 a vyššie, čo som nepredpokladal, takže využijem to.

Ďakujem všetkým! :)
Napísať odpoveď