<Glazblog/>

Editors, CSS and active links

By glazou on Tuesday 27 May 2008, 15:34 - CSS and style - Permalink

I have a serious problem related to the page properties of a web editor. All web editors are able to deal with the basic color and background properties of an HTML4 document. These include:

  1. background color
  2. foreground color
  3. background image
  4. links color
  5. active links color
  6. visited links color

Most editors only deal with the HTML attributes on the body element, but that's clearly not enough in our CSS-based world... So what about a document where styles are set only through CSS, a document you want to edit but have no control on ?

1 is rather easy to obtain : get the computed background-color value of the body element.

2 is also easy, just get the computed color value of the body element.

3 is the same but for the background-image property.

4 is a hack, the only way you can get it is inserting an anchor with a dummy target at the end of the document, retrieve the computed color property and remove the anchor from the document before the reflow happens.

6 is about the same, but set the target to the current document so the anchor is visited.

But 5 ? How do you get the default color for active links ??? There's no simple solution and I see only two ways of doing :

  • a new API on the document retrieving the computed styles for a given element if it was inserted at a given point with a given state (hover, active, ...),
  • browse all CSS rules applying to the document, select the ones applying to active links contained in the body or the root of the document, compute the resulting color...

Do you have any suggestion for 4, 5 and 6 ?

Comments

1. On Tuesday 27 May 2008, 17:25 by Jeffrey

a bit offtopic, but do you have any news regarding the status of your Composer project? Really looking forward to it!

2. On Tuesday 27 May 2008, 17:47 by ptramo

getComputedStyle method is not enough?

http://developer.mozilla.org/en/doc...

3. On Tuesday 27 May 2008, 18:02 by Fred

What ever happened to this?:

"I have good news for all of you using Nvu or Kompozer, all of you requesting a successor to Nvu, a new, more modern, more robust, more powerful editor companion to Firefox. I am immensely happy to announce that we found a new partner to give a descendance to Nvu. More news later, stay tuned, it's going to be exciting !"

http://www.glazman.org/weblog/dotcl...

4. On Tuesday 27 May 2008, 18:05 by Eevee

Can't you give a link the focus and then get its computed style?

5. On Wednesday 28 May 2008, 15:28 by Jason

If you don't mind me asking a dumb question: You said yourself things are set through CSS (so you can ignore things like <body link="" alink="" vlink="">) so why not just look for things like a, a:link, etc., in the <style> element or in the linked style sheet? Because if you don't have either of those things the answer is "default".

But if you really want to do things the hard way, Eevee's suggestion sounds good. Take the fake link you're creating and call myNewFakeLink.focus() on it and see what you get.

(Side note: Any chance of at least getting things like <tt> or <code> to work so we can set off markup easily? I realize this is just a dumb text box, but you're already taking the time to convert newlines to <br>s...)