Majid Fouladpour Majid Fouladpour - 1 month ago 8
Javascript Question

jQuery attr() fails to set attribute

I am trying to rotate an image via svg's

transform
. This is the code I have:

<svg width="100" height="100">
<image id="trns" transform="rotate(90,50,50)" width="100" height="100" xlink:href="logo.png"/>
</svg>


This successfully rotates
logo.png
by 90 degrees when the page loads. Also, when I change
90
to a different number in firbug's HTML tab the rotation changes accordingly. But when I try to change the value with jQuery, nothing happens:

$('#trns').attr('transform', 'rotate(60, 50,50)');


What does firebug do that my
attr
line does not?

Answer

Working fine here (with jQuery 1.6.2): http://jsfiddle.net/niklasvh/k3Grd/

Make sure to call it once the DOM is ready:

$(function(){
 $('#trns').attr('transform', 'rotate(60,50,50)');
});