Кубни Безиер генератор
Дизајнирајте прилагођену ЦСС цубиц-безиер() функцију времена превлачењем две контролне тачке, прегледајте је уживо у односу на линеарну референцу, а затим копирајте готову вредност.
Резултат
Ручно куцање цубиц-безиер(к1, и1, к2, и2) и поновно учитавање странице да бисте проверили осећај је спор начин подешавања анимације. Овај генератор затвара ту петљу: превуците или ручицу контролне тачке на криву, или унесите тачне бројеве у поља к1/и1/к2/и2, а крива, ЦСС стринг који се може копирати и преглед анимације уживо при свакој промени - без корака прављења, без поновног учитавања.
Две осе намерно раде другачије. к1 и к2 остају стегнути између 0 и 1, јер је то оно што ЦСС спецификација заправо захтева за цубиц-безиер() функцију времена — вредност изван тог опсега је једноставно неважећа. и1 и и2 немају такво ограничење: превуците ручицу изнад врха кутије или испод дна, и крива прелази преко свог почетка или њеног краја, што је управо начин на који се ефекти у стилу опруге и одбијања граде од једне криве ублажавања.
Видети број није исто што и видети кретање, тако да преглед покреће две идентичне лопте једну поред друге у петљи: једна се креће користећи вашу прилагођену криву, друга се креће једноставним константним линеарним темпом. Гледање како се тркају најбржи је начин да се утврди да ли крива опуштања заиста ствара осећај који желите, пре него што стигне до листе стилова. Унапред подешене странице — стварни бројеви иза ЦСС-ове сопствене кључне речи за једноставно уношење, искрена апроксимација прекорачења коју неки називају одбијањем и Гугл-ова стандардна крива дизајна материјала — спремне су почетне тачке са којих можете да превучете уместо празних контролних тачака.
Све се покреће локално у вашем претраживачу: нема отпремања, нема налога, нема повратног пута сервера, а генератор наставља да ради ван мреже након што се страница учита.