CSS3 animation-fill-mode ÊôÐÔ

ʵÀý

Ϊ h1 ÔªËØ¹æ¶¨Ìî³äģʽ£º

h1
  {
  animation-fill-mode: forwards;
  }

ä¯ÀÀÆ÷Ö§³Ö

IE Firefox Chrome Safari Opera

Internet Explorer 10¡¢Firefox ÒÔ¼° Opera Ö§³Ö animation-fill-mode ÊôÐÔ¡£

Safari ºÍ Chrome Ö§³ÖÌæ´úµÄ -webkit-animation-fill-mode ÊôÐÔ¡£

×¢ÊÍ£ºInternet Explorer 9 ÒÔ¼°¸üÔçµÄ°æ±¾²»Ö§³Ö animation-fill-mode ÊôÐÔ¡£

¶¨ÒåºÍÓ÷¨

animation-fill-mode ÊôÐԹ涨¶¯»­ÔÚ²¥·Å֮ǰ»òÖ®ºó£¬Æä¶¯»­Ð§¹ûÊÇ·ñ¿É¼û¡£

×¢ÊÍ£ºÆäÊôÐÔÖµÊÇÓɶººÅ·Ö¸ôµÄÒ»¸ö»ò¶à¸öÌî³äģʽ¹Ø¼ü´Ê¡£

ĬÈÏÖµ£º none
¼Ì³ÐÐÔ£º no
°æ±¾£º CSS3
JavaScript Óï·¨£º object.style.animationFillMode=none

Óï·¨

animation-fill-mode : none | forwards | backwards | both;
Öµ ÃèÊö
none ²»¸Ä±äĬÈÏÐÐΪ¡£
forwards µ±¶¯»­Íê³Éºó£¬±£³Ö×îºóÒ»¸öÊôÐÔÖµ£¨ÔÚ×îºóÒ»¸ö¹Ø¼üÖ¡Öж¨Ò壩¡£
backwards ÔÚ animation-delay ËùÖ¸¶¨µÄÒ»¶Îʱ¼äÄÚ£¬ÔÚ¶¯»­ÏÔʾ֮ǰ£¬Ó¦ÓÿªÊ¼ÊôÐÔÖµ£¨ÔÚµÚÒ»¸ö¹Ø¼üÖ¡Öж¨Ò壩¡£
both ÏòǰºÍÏòºóÌî³äģʽ¶¼±»Ó¦Óá£

Ïà¹ØÒ³Ãæ

CSS3 ½Ì³Ì£ºCSS3 ¶¯»­

VUE