As many of you know, the only CSS3 property that jQuery supports natively is opacity
. However, we can actually use all other CSS3 properties with the css()
method, provided that we use the JavaScript camel-case notation for CSS style properties. For example, given a test element which has only a width, a height and a background color, we can write the following:
$(document).ready(function() { var css3Styles = { mozBorderRadius: '6px', borderRadius: '6px', mozBoxShadow: '4px 4px 4px silver', webkitBoxShadow: '4px 4px 4px silver', boxShadow: '4px 4px 4px silver' }; $('#test').css(css3Styles); });
And this is the result:
As you can see, we use both the standard and prefixed property notation using the JavaScript camel-case convention.