SVG и смена его позиции при наведении курсора

[Bugert]

Речь идет об обычной кнопке с hover-эффектом. С png все получается. Код выглядит примерно так:

a.overBtn {    display: block;    height: 32px;    width: 124px;    background-image: url(../images/bt.png);    background-repeat: no-repeat;}a.overBtn:hover {    background-position: 0px -32px;}

Для изображения устанавливаются четкие границы. И нижняя часть кнопки, которая перемещается при наведении курсора в видимую позицию, отрезана заданными размерами изображения. Если png поменять на svg, то последний тупо масштабируется (уменьшается), заполняя заданные размеры. Того же эффекта достигнуть не удается. SVG всегда заполняет данный блок. 

 

Можно ли как-то реализовать hover с одной картинкой, путем изменения позиции, с помощью svg?

[wwt]

http://jsfiddle.net/ybz4uL3v/ смещается нормально вроди бы.

[Bugert]

Точно? Посмотреть не могу ("We're truly sorry, but there is no such page").

Edited August 9, 2015 by Bugert

[wwt]

Пробел в ссылку попал, вот http://jsfiddle.net/ybz4uL3v/