I am trying to rotate an image via svg's transform
. This is the code I have:
我试图通过svg的变换旋转图像。这是我的代码:
<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:
当页面加载时,这会成功将logo.png旋转90度。此外,当我在firbug的HTML选项卡中将90更改为不同的数字时,旋转会相应地更改。但是当我尝试使用jQuery更改值时,没有任何反应:
$('#trns').attr('transform', 'rotate(60, 50,50)');
What does firebug do that my attr
line does not?
萤火虫做什么我的attr线没有?
4 个解决方案
#1
7
Working fine here (with jQuery 1.6.2): http://jsfiddle.net/niklasvh/k3Grd/
在这里工作正常(使用jQuery 1.6.2):http://jsfiddle.net/niklasvh/k3Grd/
Make sure to call it once the DOM is ready:
确保在DOM准备好后调用它:
$(function(){
$('#trns').attr('transform', 'rotate(60,50,50)');
});
#2
4
Very strange indeed, this seems to work
确实非常奇怪,这似乎有效
$('#trns')[0].setAttribute('transform','rotate(20,50,50)')
Also, if u look at $('#trns').attr('transform'), you are getting an object.. Not enough time to look into that now.
另外,如果你看看$('#trns')。attr('transform'),你就会得到一个对象..现在没有足够的时间来研究它。
#3
3
If you're using jquery >= 1.6 try using prop
instead of attr
.
Hope this helps. Cheers
如果你正在使用jquery> = 1.6,请尝试使用prop而不是attr。希望这可以帮助。干杯
#4
0
.attr() works in 3.1.1 like this
.attr()在3.1.1中工作
.attr({ style: "prop : val; prop : val; prop : val" })
this might be a way around version problems.
这可能是解决版本问题的方法。
#1
7
Working fine here (with jQuery 1.6.2): http://jsfiddle.net/niklasvh/k3Grd/
在这里工作正常(使用jQuery 1.6.2):http://jsfiddle.net/niklasvh/k3Grd/
Make sure to call it once the DOM is ready:
确保在DOM准备好后调用它:
$(function(){
$('#trns').attr('transform', 'rotate(60,50,50)');
});
#2
4
Very strange indeed, this seems to work
确实非常奇怪,这似乎有效
$('#trns')[0].setAttribute('transform','rotate(20,50,50)')
Also, if u look at $('#trns').attr('transform'), you are getting an object.. Not enough time to look into that now.
另外,如果你看看$('#trns')。attr('transform'),你就会得到一个对象..现在没有足够的时间来研究它。
#3
3
If you're using jquery >= 1.6 try using prop
instead of attr
.
Hope this helps. Cheers
如果你正在使用jquery> = 1.6,请尝试使用prop而不是attr。希望这可以帮助。干杯
#4
0
.attr() works in 3.1.1 like this
.attr()在3.1.1中工作
.attr({ style: "prop : val; prop : val; prop : val" })
this might be a way around version problems.
这可能是解决版本问题的方法。