У меня проблемы с браузерами Webkit (например, Chrome, Safari) и изменением шаблонных заливок в объектах SVG. Пример ниже пытается переключить заливку прямоугольника между сплошным красным и логотипом Google при наведении курсора:
<svg xmlns="http://www.w3.org/2000/svg" version="1.1">
<defs>
<pattern id="img1" patternUnits="userSpaceOnUse" width="275" height="95">
<image xlink:href="http://www.google.com/intl/en_com/images/srpr/logo3w.png" x="0" y="0" width="275" height="95" />
</pattern>
</defs>
<rect id="rect" width="550" height="190" style="fill:url(#img1);stroke-width:1;stroke:rgb(0,0,0)">
<set attributeName="fill" from="url(#img1)" to="red" begin="mouseover" end="mouseout"/>
</rect>
</svg>
В Chrome / Safari прямоугольник правильно заполняет прямоугольник с шаблоном логотипа Google при загрузке. При наведении курсора на прямоугольник заливка становится красной. При наведении указателя мыши заливка отображается белым цветом, а не возвращается к логотипу Google.