Comments on: A Style All Their Own

By: Ben Swieringa

Ben Swieringa — Mon, 23 Jun 2008 15:20:04 +0000

Tip: Change multiple attributes in multiple elements at once.

multipleSpans=YAHOO.util.Dom.getElementsByClassName(‘multiple’, ‘span’);
YAHOO.util.Dom.setStyle(multipleSpans, ‘cssText’,'text-decoration:underline;cursor:pointer;’);

By: Luke

Luke — Fri, 13 Jun 2008 19:13:49 +0000

@Matt,

I didn’t benchmark assigning cssText vs setting the className. Generally speaking, setting element style directly is only preferable when you need to assign dynamic values. Besides being better practice, it is most likely faster to update className because the browser does not need to do the extra step of parsing the cssText and updating the properties in the element’s style collection before the repaint.

@Marius-Remus
I might have misread the build number. I’ve since installed 9.5 GA and verified there were no modifications to the style collection members. Incidentally, Dragonfly shows ‘audio-level’, ‘rest’, ‘rest-after’, and ‘rest-before’, but they apparently don’t have representation in the style collection as audioLevel (etc).

By: A Style All Their Own « outaTiME

A Style All Their Own « outaTiME — Fri, 13 Jun 2008 15:05:03 +0000

[...] Click through to see the full table of CSS properties. [...]

By: Marius-Remus Mate

Marius-Remus Mate — Fri, 13 Jun 2008 13:08:28 +0000

Considering that Opera 9.5 was released yesterday, I don’t see why you would use a really old beta version of the browser. Current build number is 10063, while the version you tested is build number 4808.

By: Matt Robinson

Matt Robinson — Fri, 13 Jun 2008 09:29:24 +0000

Very useful, thanks. Any idea whether changing cssText is faster than changing the class?

By: 5307853

5307853 — Fri, 13 Jun 2008 01:36:25 +0000

This is great. Would you consider updating this chart to repeat the headings (browsers) every 30 or 50 rows or so?

By: Darek Adamkiewicz

Darek Adamkiewicz — Thu, 12 Jun 2008 20:46:16 +0000

In FF2+ you can’t get css ‘background-position’ value in JavaScript.
Of course if you set it in JavaScript you’ll get it.

And in FF2+ negative ‘z-index’ value of (‘absolute’, ‘relative’, ‘fixed’) element makes that element not visible.

Both should be fixed in FF3

Just my 2 cents

Regards
Darek

By: Chris Griego

Chris Griego — Thu, 12 Jun 2008 20:32:01 +0000

I’ve been known to use a technique like this to detect CSS support from JavaScript in rare situations.

if (!YAHOO.lang.isUndefined(n.style.maxWidth))