<svg>
	<mask id="mask">
		<circle r="10" cx="100" cy="100"
					 class="c-mask-circle"/>
	</mask>
  
  <g mask="url(#mask)">
  	<image xlink:href="http://static.colourlovers.com/images/patterns/2693/2693008.png" width="100%" height="100%"/>
  </g>
</svg>
svg {
  display: block;
  width: 200px;
  height: 200px;
  margin: 2em auto;
}
.c-mask-circle {
  fill: white;
  transform-origin: 100px 100px;
  animation: scale 5s infinite;
}

@keyframes scale {
  50% {
    transform: scale(10);
  }
}
View Compiled
// Mask doesn't animate in Firefox

External CSS

This Pen doesn't use any external CSS resources.

External JavaScript

This Pen doesn't use any external JavaScript resources.