will-changeVara CSS optimeerib animatsioone lastes brauseri teada, millised omadused ja elemendid on peaaegu manipuleerida võib suurendada jõudlust, et eelkõige operatsiooni.
Sellel atribuudil on neli väärtust:
auto: rakendatakse brauseri standardseid optimeerimisi.scroll-position: näitab, et elemendi kerimispositsioon animeeritakse millalgi lähitulevikus, nii et brauser valmistub sisuks, mis pole elemendi kerimisaknas nähtav.contents: eeldatakse, et elemendi sisu muutub, nii et brauser ei pane selle elemendi sisu vahemällu.: mis tahes kasutaja määratletud atribuut, nagutransformvõiopacitymida me soovimewill-changerakendada.
Võime brauserit teavitada, et transformvara on muutumas järgmiselt :
.element ( will-change: transform; )Või kui tahame deklareerida mitu väärtust, võime kasutada komadega eraldatud loendit, näiteks:
.element ( will-change: transform, opacity; )Oluline on will-changesiiski vara mitte üle kasutada, sest see võib tegelikult põhjustada lehe vähem toimivuse (pange tähele, et allsellel atribuudil pole mõjuval põhjusel väärtust). Selle tulemusel soovitab MDN vara kasutada olemasolevate jõudlusprobleemide jaoks viimase abinõuna, mitte selliste probleemide puhul, mis teie arvates võivad juhtuda. Ja selle kasutamisel on soovitatav vahetada will-changevahetult enne elemendi või atribuudi muutmist ja seejärel vahetult pärast protsessi lõppu uuesti välja lülitada.
Brauseri tugi
Need brauseri tugiandmed pärinevad Caniuse'ilt, millel on üksikasjalikum teave. Number näitab, et brauser toetab selle versiooni ja uuemat funktsiooni.
Töölaud
| Chrome | Firefox | IE | Edge | Safari |
|---|---|---|---|---|
| 36 | 36 | Ei | 79 | 9.1 |
Mobiil / tahvelarvuti
| Android Chrome | Android Firefox | Android | iOS-i Safari |
|---|---|---|---|
| 88 | 85 | 81 | 9.3 |