jQuery .css() fallbacks?

Question

What is the proper way to do fallbacks with .css()? This would most commonly be used for font fallbacks but I am using it for cursor images.

Here's what I got that isn't working:

$("#dragable").css('cursor','url(images/grabbing.gif), -moz-grabbing, auto');

**UPDATE: can someone tell me the valid CSS for starters?

What I have:

cursor: url(images/grabbing.gif), -moz-grabbing, auto;

... doesn't work.**

For font fallbacks you should use the standard CSS syntax, eg jQueryObj.css({ fontFamily: '"Primary Font", "Fallback Font", serif' });. Other properties will be another matter and I'll leave that up to the hopefully forthcoming answers. — eyelidlessness
– eyelidlessness, Commented Nov 23, 2010 at 22:36

vtambourine · Accepted Answer · 2010-11-24 18:33:31Z

4

Using dynamic inline styles not always a good idea. Consider dynamic classes. Define somewhere in css specific class for draggable element:

.cur-draggable { cursor: url(images/grabbing.gif), -moz-grabbing, auto; }

And try to add this class, instead of style itself;

$("#dragable").addClass('cur-draggable');

answered Nov 24, 2010 at 18:33

vtambourine

2,1393 gold badges18 silver badges27 bronze badges

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

1 Comment

Dave Over a year ago

... this makes life easier. Good idea.

RussellUresti · Accepted Answer · 2010-11-23 22:43:47Z

0

Not sure why that breaks it, but the values aren't being written to the DOM.

Though, the css() function is really just a shortcut to editing the "style" attribute inline on the element, so you could do this to get the same result:

$("#dragable").attr('style','cursor: url(images/grabbing.gif), -moz-grabbing, auto');

answered Nov 23, 2010 at 22:43

RussellUresti

6,2214 gold badges30 silver badges26 bronze badges

2 Comments

eyelidlessness Over a year ago

Note that this will overwrite other style properties.

RussellUresti Over a year ago

True, but you could easily bypass that by first retrieving the contents of the style attribute and then appending the string. Something like $("#dragable").attr('style',$(this).attr('style') + 'cursor: url(images/grabbing.gif), -moz-grabbing, auto'); -- not sure that exact syntax will work, but the principle is there.

Collectives™ on Stack Overflow

jQuery .css() fallbacks?

2 Answers 2

1 Comment

2 Comments

Your Answer

Hot Network Questions

Collectives™ on Stack Overflow

2 Answers 2

1 Comment

2 Comments

Your Answer

Sign up or log in

Post as a guest

Related