will-change的问题

will-change的问题

老师,我还是不太理解will-change的提前声明和remove

正在回答 回答被采纳积分+1

登陆购买课程后可参与讨论,去登陆

1回答
好帮手慕慕子 2020-02-03 13:47:01

同学你好, 简单理解就是will-change帮助我们提前声明了一个动画效果,让浏览器可以预先加载,提高页面渲染速度,当我们在父元素触发子元素的动画之后,我们不需要手动删除这个声明的动画, 浏览器会自动remove。

老师这里举个示例帮助同学理解:

 HTML结构如下

http://img1.sycdn.imooc.com//climg/5e37b3410924a12209160296.jpg

CSS中设置样式, 在子元素中提前声明will-change, 因为transition需要触发事件才能有效果,比如鼠标移入一个元素,才可以触发transition, 如视频中所讲:当网页加载完的时候 是没有调用这个transition的, transition是css改变的时候才调用,所以这里will-change是提前申明了

http://img1.sycdn.imooc.com//climg/5e37b35509d77ad909040896.jpg

鼠标移入父元素,触发子元素的动画, 在鼠标离开父元素后, 子元素的will-change会自动被移除

http://img1.sycdn.imooc.com//climg/5e37b36909c13a9009540216.jpg

这个知识点在实际中应用的很少,同学简单了解一下即可。

如果我的回答帮助到了你,欢迎采纳,祝学习愉快~

问题已解决,确定采纳
还有疑问,暂不采纳

恭喜解决一个难题,获得1积分~

来为老师/同学的回答评分吧

0 星
请稍等 ...
意见反馈 帮助中心 APP下载
官方微信

在线咨询

领取优惠

免费试听

领取大纲

扫描二维码,添加
你的专属老师