Старый вопрос, может быть с ошибками, как решить?

Question

[Максим]

Реализовал такой вид svg:

<svg width="400" height="240" style="position:relative; left:-120px;">
    <defs>
        <pattern id="img1" patternUnits="userSpaceOnUse" width="400" height="240">
            <image xlink:href="http://www.imagefully.com/wp-content/uploads/2015/07/Sexy-Pause-Girl-Pic.jpg" x="0" y="0" width="400" height="240"/>
        </pattern>
    </defs>
  <polygon points="110 220,10 10,380 10,380 220"
  style="fill:url(#img1); stroke:0; stroke-width:0; opacity="1" />
</svg>

Это в действии

Как сделать эффект увеличения ? только что бы не блок увеличивался а именно сам image

Answer 1

[Максим]

Ответ был дан на американской версии stackoverflow.com :

defs:hover