Setting CSS3 gradient properties with jQuery?

Question

I'm writing a plugin that is reliant on CSS3 gradient background properties. I have no problem getting something like this to work:

$(this).css({ '-webkit-box-shadow': 'inset 2px 2px 5px #DEDEDE' });

However, this fails to work:

$(this).css({ 'background': '-webkit-gradient(linear,left top,left bottom,from(#f4f4f4),to(#FFFFFF))' });

I was under the assumption that .css() worked with any property supported by the browser so I'm either setting it wrong with jQuery or this property isn't supported?

Answer 1

I doubt the first example works either: if you want to set css property, you have to use two parameters, like $(this).css('background', '-webkit-gradient(linear,left top,left bottom,from(#f4f4f4),to(#FFFFFF))');​​​​​​​

More on the subject:
http://api.jquery.com/css/

edit
You're right, it's possible to set css properties with {name:value} notation, they just don't tell it in the function summary (you have to read further on).
Anyway, here's the working example with two parameters (the second one from your post): http://jsfiddle.net/BX9Wa/