{"id":15,"date":"2019-02-20T21:15:40","date_gmt":"2019-02-21T00:15:40","guid":{"rendered":"https:\/\/www.shefarol.com.br\/wordpress\/avancado\/?p=15"},"modified":"2019-02-21T20:51:30","modified_gmt":"2019-02-21T23:51:30","slug":"animacoes-em-css3","status":"publish","type":"post","link":"https:\/\/www.shefarol.com.br\/wordpress\/avancado\/2019\/02\/20\/animacoes-em-css3\/","title":{"rendered":"Anima\u00e7\u00f5es em CSS3"},"content":{"rendered":"\n<div class=\"wp-block-image\"><figure class=\"alignleft\"><img loading=\"lazy\" decoding=\"async\" width=\"198\" height=\"198\" src=\"https:\/\/www.shefarol.com.br\/wordpress\/avancado\/wp-content\/uploads\/2019\/02\/css3.png\" alt=\"\" class=\"wp-image-13\" srcset=\"https:\/\/www.shefarol.com.br\/wordpress\/avancado\/wp-content\/uploads\/2019\/02\/css3.png 198w, https:\/\/www.shefarol.com.br\/wordpress\/avancado\/wp-content\/uploads\/2019\/02\/css3-150x150.png 150w\" sizes=\"auto, (max-width: 198px) 100vw, 198px\" \/><\/figure><\/div>\n\n\n\n<p>Anima\u00e7\u00f5es CSS tornam poss\u00edvel animar transi\u00e7\u00f5es de um estilo CSS para outro. Anima\u00e7\u00f5es se consistem de dois componentes: um estilo descrevendo a anima\u00e7\u00e3o e um set de keyframes que indicam o estado final e inicial do estilo CSS da anima\u00e7\u00e3o, bem como poss\u00edveis waypoints intermedi\u00e1rios ao longo do caminho.<\/p>\n\n\n\n<p>Existem tr\u00eas vantagens chave para anima\u00e7\u00f5es CSS al\u00e9m das t\u00e9cnicas tradicionais de anima\u00e7\u00e3o dirigidas por script:<\/p>\n\n\n\n<ol class=\"wp-block-list\"><li>S\u00e3o de f\u00e1cil utiliza\u00e7\u00e3o para anima\u00e7\u00f5es simples; voc\u00ea pode cri\u00e1-las sem mesmo ter que conhecer JavaScript.<\/li><li>As anima\u00e7\u00f5es executam bem, mesmo sobre moderada carga do sistema. Anima\u00e7\u00f5es simples podem normalmente ser executadas precariamente em JavaScript (a n\u00e3o ser que sejam bem feitas). A ferramenta de renderiza\u00e7\u00e3o pode usar frame-skipping e outras t\u00e9cnicas para manter a performance o mais est\u00e1vel poss\u00edvel.<\/li><li>Deixando o navegador controlar a sequ\u00eancia de anima\u00e7\u00e3o permite ao navegador otimizar a performance e efici\u00eancia em, por exemplo, reduzir a frequ\u00eancia de update de anima\u00e7\u00f5es correndo em abas que n\u00e3o est\u00e3o vis\u00edveis no momento.<\/li><\/ol>\n","protected":false},"excerpt":{"rendered":"<p>Anima\u00e7\u00f5es CSS tornam poss\u00edvel animar transi\u00e7\u00f5es de um estilo CSS para outro. Anima\u00e7\u00f5es se consistem de dois componentes: um estilo descrevendo a anima\u00e7\u00e3o e um set de keyframes que indicam o estado final e inicial do estilo CSS da anima\u00e7\u00e3o, bem como poss\u00edveis waypoints intermedi\u00e1rios ao longo do caminho. Existem tr\u00eas vantagens chave para anima\u00e7\u00f5es [&hellip;]<\/p>\n","protected":false},"author":1,"featured_media":0,"comment_status":"closed","ping_status":"open","sticky":false,"template":"","format":"standard","meta":{"footnotes":""},"categories":[2],"tags":[9,10],"class_list":["post-15","post","type-post","status-publish","format-standard","hentry","category-css3","tag-animacoes","tag-css3"],"_links":{"self":[{"href":"https:\/\/www.shefarol.com.br\/wordpress\/avancado\/wp-json\/wp\/v2\/posts\/15","targetHints":{"allow":["GET"]}}],"collection":[{"href":"https:\/\/www.shefarol.com.br\/wordpress\/avancado\/wp-json\/wp\/v2\/posts"}],"about":[{"href":"https:\/\/www.shefarol.com.br\/wordpress\/avancado\/wp-json\/wp\/v2\/types\/post"}],"author":[{"embeddable":true,"href":"https:\/\/www.shefarol.com.br\/wordpress\/avancado\/wp-json\/wp\/v2\/users\/1"}],"replies":[{"embeddable":true,"href":"https:\/\/www.shefarol.com.br\/wordpress\/avancado\/wp-json\/wp\/v2\/comments?post=15"}],"version-history":[{"count":2,"href":"https:\/\/www.shefarol.com.br\/wordpress\/avancado\/wp-json\/wp\/v2\/posts\/15\/revisions"}],"predecessor-version":[{"id":114,"href":"https:\/\/www.shefarol.com.br\/wordpress\/avancado\/wp-json\/wp\/v2\/posts\/15\/revisions\/114"}],"wp:attachment":[{"href":"https:\/\/www.shefarol.com.br\/wordpress\/avancado\/wp-json\/wp\/v2\/media?parent=15"}],"wp:term":[{"taxonomy":"category","embeddable":true,"href":"https:\/\/www.shefarol.com.br\/wordpress\/avancado\/wp-json\/wp\/v2\/categories?post=15"},{"taxonomy":"post_tag","embeddable":true,"href":"https:\/\/www.shefarol.com.br\/wordpress\/avancado\/wp-json\/wp\/v2\/tags?post=15"}],"curies":[{"name":"wp","href":"https:\/\/api.w.org\/{rel}","templated":true}]}}