Gineadóir CSS Cubic Bezier
Tarraing an dá láimhseáil chun cuar maolaithe a mhúnlú, féach ar phonc ag gluaiseacht air i gcomparáid le ceann seasta, agus cóipeáil an luach cubic-bezier().
cubic-bezier(0.25, 0.1, 0.25, 1)Déantar an cuar a tharraingt go díreach i do bhrabhsálaí. Ní uaslódáiltear aon rud a shocraíonn tú anseo chuig BroBroGo.
Ceisteanna Coitianta
Cad a chiallaíonn an dá láimhseáil agus an ceithre uimhir?
Ritheann an cuar ón mbun ar chlé (an tús) go dtí an barr ar dheis (an deireadh), le ham ag dul ó chlé go deas agus dul chun cinn ag dul suas. Is iad an dá láimhseáil na pointí rialaithe a lúbann é — tá X agus Y ag gach ceann acu, mar sin le chéile is iad cubic-bezier(x1, y1, x2, y2). Fanann X idir 0 agus 1, agus is féidir le Y dul os cionn an bhairr nó faoi bhun an bhun chun go ndéanfadh an ghluaiseacht róléim nó tarraingt siar sula socraíonn sí.
Conas a úsáidim an luach i mo CSS?
Cóipeáil an cubic-bezier() agus cuir isteach é áit ar bith a dtéann feidhm uainíochta — transition-timing-function, animation-timing-function, nó an nodaireacht ghearr, m.sh. transition: transform 0.3s cubic-bezier(0.25, 0.1, 0.25, 1). Níl sna heochairfhocail ease, ease-in, ease-out agus ease-in-out ach cuair cubic-bezier seasta, mar sin taispeánann roghnú ceann de na réamhsocruithe sin an luach cruinn taobh thiar den eochairfhocal.
An féidir leis éifeacht phreabach nó leaisteach a dhéanamh?
Ní féidir leis féin. Is féidir le cubic-bezier amháin réamh-mheas agus róléim a dhéanamh — tarraingíonn na réamhsocruithe "back" láimhseáil amháin thar an mbosca chun é sin a dhéanamh go díreach — ach ní féidir leis ach bogadh bealach amháin agus ansin socrú. Athraíonn preabadh agus leaisteachas treo roinnt uaireanta, rud nach féidir le cubic-bezier amháin a chur in iúl; teastaíonn eochairfhrámaí CSS nó an fheidhm linear() le go leor stadanna chuige sin.