Is it possible to work with CSS properties?
For instance:
-webkit-transform: scaleX(-1) scaleY(-1)
Can I easily remove scaleX(-1) or add something new, without rewriting the whole -webkit-transform or changing classes?
-
What are you asking here? You can add/remove classes which reference the declarations that you want with jQuery quite easily.RyanP13– RyanP132011-03-11 15:53:16 +00:00Commented Mar 11, 2011 at 15:53
-
@RyanP13 Suppose I need to change between 4 or even more different states and each of one has several properties for different browsers (-webkit-transform, filter, etc). I want to reduce the amount of code and find more elegant way to do this.Daniel J F– Daniel J F2011-03-11 16:18:10 +00:00Commented Mar 11, 2011 at 16:18
Add a comment
|
1 Answer
That css property takes two arguments. Therefore you cannot change one without touching the other. But this should be all you need to do:
$("#your-element").css("-webkit-transform","scaleX(-1) scaleY(-1)");
Edit
function changeTransform(el, x,y){
var val = x + " " + y;
$(el).css({"-webkit-transform":val, "-moz-transform": val, "-webkit-transform": val, "-o-transform": val});
}
3 Comments
Daniel J F
Suppose I have
-moz-transform: scaleX(-1); -webkit-transform: scaleX(-1); -o-transform: scaleX(-1); -transform: scaleX(-1); and I want to add scaleY(-1) and then maybe to remove scaleX(-1), that means I'll have to write a class for every action and there is no way around?
picardo
You can define a function where you write set all these properties and then call it whenever you need with the new arguments.
Daniel J F
So, it's impossible to work directly with arguments. I get it. I will consider using a function instead. Thanks.