2

OK, this is probably quite easy, but I cannot find it on Google or stackoverflow.

Instead of

var color = $(div).css('color')

I want to store the css in a variable.

var theCss = $(div).css  
var color = theCss('color')  // no, doesn't work

Is it at all possible? Of course the reason why I want this is much more complicated, so I would be very much helped if there is somehow a way to store

Improve this question
5
  • 3
    Have you checked out this link? Get all CSS using jQuery Commented Sep 9, 2014 at 14:31
  • @user2646829 you beat me to it. Commented Sep 9, 2014 at 14:33
  • 2
    Do you want that theCss will always return the actual calculated value of the element or the one the element had at the time you do var theCss = $(div).css Commented Sep 9, 2014 at 14:36
  • @t.niese Good point. The one it had at that time. That makes a big difference, right? The reason I am asking is because I need to find out which CSS elements change when the mouse goes over a A HREF. Don;t ask why - it is complicated. Commented Sep 9, 2014 at 14:45
  • If you want to compare two states you need to cache those values. Comparing all css properties might be a pain and unnecessary, so you should check if it is really necessary to compare all and only cache those (e.g. like shown in the answer of Pointy). But it seems that your use-case is that special that most answers would not be correct as they won't fully address your issue. Commented Sep 9, 2014 at 16:45

2 Answers 2

Reset to default
5

It;s a little bit more complicated than you expect, but you can use .bind mixed with $.fn.css. Something like this:

var cssFunc = $.fn.css.bind($('p'));

Then, you can call it like this:

cssFunc('color');

You can also change the css with this method:

cssFunc('color', red);

Fiddle : http://jsfiddle.net/f8yanzsu/

For the browser support, as @dfsq said, you can use $.proxy, the jQuery polyfill of the .bind() function, which is supported by IE 9 and upper.

var cssFunc = $.proxy($.fn.css, $('p'));

Note: This method works for all jQuery methods, not just css.

Improve this answer
Sign up to request clarification or add additional context in comments.

9 Comments

Wow, I would have NEVER found that. Glas I asked here. I hope it works on all browsers, I will test.
@Roemer It will not work in IE<9. If you need old IE better to go with this: $.proxy($.fn.css, $('p')).
@dfsq out of curiosity, except for the support, is there an other reason to use use proxy?
No, only support, as I said. Doesn't make sense to use $proxy if there is .bind.
Bad thing is, I need to get a COPY of the css, not a link to the original. I need to see what changes are made to the css since I made the copy. So even though the answer = 100% correct, it does not yet provide a solution for me. But with all the help I got here, I will be able to find a second best solution that works. ;)
|
2

You can't get the sum total of all CSS from jQuery. You can however pass in an array of property names (as of jQuery 1.9) and get back a list of values:

var cssStuff = $(div).css(["color", "fontSize", "width"]);
Improve this answer

1 Comment

Why was this downvoted, out of curiosity? Who downvotes without providing any explantion; what's even the point?

Start asking to get answers

Find the answer to your question by asking.

Ask question

Explore related questions

See similar questions with these tags.