will-changeHotel v CSS optimizira animacije z dajanjem brskalnika znanje, katere lastnosti in elementi so ravno na tem, da se manipulira, kar lahko poveča učinkovitost te določene operacije.
Ta lastnost ima štiri vrednosti:
auto: uporabljene bodo standardne optimizacije brskalnika.scroll-position: označuje, da bo položaj drsenja elementa animiran v bližnji prihodnosti, zato se bo brskalnik pripravil na vsebino, ki ni vidna v drsnem oknu elementa.contents: vsebina elementa naj bi se spremenila, zato brskalnik ne bo predpomnil vsebine tega elementa.: katera koli uporabniško določena lastnost, kot jetransformali naopacitykatero želimowill-changeuporabiti.
Brskalnik lahko obvestimo, da se bo transformlastnost kmalu zgodila tako:
.element ( will-change: transform; )Če pa želimo razglasiti več vrednosti, lahko uporabimo seznam, ločen z vejicami, na primer:
.element ( will-change: transform, opacity; )Pomembno je, da will-changelastnosti ne pretirano uporabljate, saj bi lahko stran dejansko povzročila manj zmogljivosti (upoštevajte, da allvrednost za to lastnost ni upravičena). Kot rezultat, MDN priporoča, da se lastnost uporablja kot skrajno sredstvo za obstoječe težave z zmogljivostjo in ne za tiste, za katere predvidevate, da bi se lahko zgodile. Pri uporabi je priporočljivo, da preklopite will-changetik preden se element ali lastnost spremeni in nato kmalu po končanem postopku ponovno izklopite.
Podpora brskalnika
Ti podatki o podpori brskalnika so od Caniuse, ki vsebuje več podrobnosti. Številka pomeni, da brskalnik podpira to funkcijo v tej različici ali novejši.
Namizje
| Chrome | Firefox | IE | Rob | Safari |
|---|---|---|---|---|
| 36 | 36 | Ne | 79 | 9.1 |
Mobilni / tablični računalnik
| Android Chrome | Android Firefox | Android | iOS Safari |
|---|---|---|---|
| 88 | 85 | 81 | 9.3 |