Post Archive

› April 23, 2003

Bookmarklet: List Computed Styles - better, stronger, faster

  • Reported by pixy

I've rewritten the List Computed Styles bookmarlet. The new favelet displays computed value of any CSS property of all elements under the cursor (it uses the onmouseover event). It works in IE6/Win, IE5/Mac, and Mozilla. It doesn't work in IE5/Win, Opera and Safari - I don't know why yet...

Comments

1. April 23, 2003 01:05 PM

Quote this comment

Nate Posted…

Wow that works really well! What a great tool for deciphering style problems, or even just analyzing other site designs. Looking forward to an Opera and Safari version... if possible!

2. April 23, 2003 04:41 PM

Quote this comment

Lon Posted…

it errs a lot if you close the pop up window... and a drop down box would be nice instead of having to type in stuff. but otherwise neat.

3. April 24, 2003 12:03 AM

Quote this comment

Jesse Ruderman Posted…

Pixy's is one of three competing "computed styles" bookmarklets. They all show information about a node you indicate (by hovering or clicking) and its ancestors, but they differ in what information they show.
  • Pixy's: you specify a property, it shows the value of that property at each level.
  • Jesse's: shows all properties that change at each level, using shorthand when appropriate.
  • Stuart's: shows all matching style rules at each level, as long as the selector uses only tag names, classes, ids, attributes, and the descendant combinator, and isn't part of an @imported sheet. (Uses Simon's getElementsBySelector.)

4. April 24, 2003 08:01 AM

Quote this comment

pixy Posted…

Jesse: I agree, but I have one addition. The second two bookmarklets don't work in IE (at least in MacIE). Hopefuly, I can add a selectbox to choose property from (instead of typing in) in the future...

5. April 24, 2003 01:57 PM

Quote this comment

Doug Baker Posted…

Wow! Very cool, Pixy.