在jQuery中使用CSS转换属性 [英] Using css transform property in jQuery
问题描述
由于每种浏览器似乎都使用自己的方法,因此如何使用jQuery指定跨浏览器转换控件?
How can you specify cross-browser transform controls using jQuery since each browser seems to use its own methodology?
这是我用于Firefox的代码,但我什至无法使它正常工作.我认为这是因为无法分辨出哪个转换–缩放,旋转,倾斜–使用.
Here is the code I am using for Firefox but I can't even get it to work. I think it's because there is no way to tell which transformation – scale, rotate, skew – to use.
$(".oSlider-rotate").slider({
min: 10,
max: 74,
step: .01,
value: 24,
slide: function(e,ui){
$('.user-text').css('transform', ui.value)
}
});
推荐答案
如果要使用特定的转换函数,则只需在值中包含该函数即可.例如:
If you want to use a specific transform function, then all you need to do is include that function in the value. For example:
$('.user-text').css('transform', 'scale(' + ui.value + ')');
第二,浏览器支持越来越好,但是您可能仍需要使用供应商前缀,如下所示:
Secondly, browser support is getting better, but you'll probably still need to use vendor prefixes like so:
$('.user-text').css({
'-webkit-transform' : 'scale(' + ui.value + ')',
'-moz-transform' : 'scale(' + ui.value + ')',
'-ms-transform' : 'scale(' + ui.value + ')',
'-o-transform' : 'scale(' + ui.value + ')',
'transform' : 'scale(' + ui.value + ')'
});
jsFiddle,例如: http://jsfiddle.net/jehka/230/
jsFiddle with example: http://jsfiddle.net/jehka/230/
这篇关于在jQuery中使用CSS转换属性的文章就介绍到这了,希望我们推荐的答案对大家有所帮助,也希望大家多多支持IT屋!