keyframes auf images

[gd0123456]

Ist es möglich keyframes auch auf Images anzuwenden, also ohne dass sie ins div eingebetet sind. Sprich z.B. soll die Breite vom bild kleiner werden oder die Höhe?

 

[jakestyler]

Keyframes kenne ich aus dem Bereich Post-Production in Videos, in Sachen CSS sagt mir das aber nichts. Vielleicht ein Beispiel oder etwas genauer?

 

[threadi]

Schau mal hier: http://pencilscoop.com/2014/04/animating-images-with-css-keyframes

 

[Chronos]

Ja beispielsweise so:
http://codepen.io/anon/pen/avNGqX?editors=110

<img src="http://i.imgur.com/LM2qgek.jpg" id="img-keyframe" class="grow" alt="Northwest_Sardinia">

CSS:

#img-keyframe {
  width: 620px;
}

.grow {
  animation: grow 3s linear;
  animation-iteration-count: 1;
}

@keyframes grow {
  from {
    width: 620px
  }
  to {
    width: 840px
  }
}