Will Change
Beri petunjuk kepada pelayar tentang perubahan akan datang
Sintaks
visual="will-change:[value]"Nilai
| Nilai | CSS Output | Huraian |
|---|---|---|
auto | will-change: auto | Pengoptimuman automatik |
scroll | will-change: scroll-position | Perubahan skrol |
contents | will-change: contents | Perubahan kandungan |
transform | will-change: transform | Perubahan transform |
opacity | will-change: opacity | Perubahan kelegapan |
Contoh
html
<div visual="will-change:transform">Optimized for animation</div>Pratonton
Akan Berubah
visual="will-change:transform" - Optimumkan untuk perubahan akan datang
transform
opacity
Lihat Kod
html
<div layout="flex" space="g:medium p:medium" visual="bg:neutral-100 dark:bg:neutral-900 rounded:medium">
<div space="p:small" visual="bg:primary text:white rounded:small">transform</div>
<div space="p:small" visual="bg:primary text:white rounded:small">opacity</div>
</div>