Ændre border-color dynamisk

problemmet er at firefox holder sig til den officiele DOM standard fra W3C (hvis man kan kalde det et problem) hvorimod Microsoft bruger nærmest en blanding mellem den og deres egen. addRule bliver derfor til insertRule og removeRule bliver til deleteRule. Ud over det bruger microsoft document.styleSheets[index].rules for de forskellige regler, mens firefox (og mozilla) bruger: document.styleSheets[iSheets-1].cssRules.

Ud over det fungerer insertRule på en lidt anderledes måde, da du i første argument skal skrive hele reglen og ikke kun hvad den skal gælde for. Det andet argument bliver her brugt til at angive hvor i regelsættet den skal sættes ind (hvis den er lig med længden af regelsættet (cssRules.length) bliver den sat hen i enden).

Derfor kommer koden til at se sådan ud (for at tage deres eksempel):

function addTheRule()
{
var iSheets = document.styleSheets.length;
elm = document.getElementById("oEffectRules");

// make sure there is a stylesheet to add to
if (0 < iSheets && document.styleSheets)
    {
      if (document.styleSheets[iSheets-1].addRule) {document.styleSheets[iSheets-1].addRule("P", "font-size:18pt");}
      else {document.styleSheets[iSheets-1].insertRule("P {font-size:18pt}",document.styleSheets[iSheets-1].cssRules.length);}
      elm.innerHTML=elm.innerHTML;
      iRules = (document.styleSheets[iSheets-1].rules) ? document.styleSheets[iSheets-1].rules.length : document.styleSheets[iSheets-1].cssRules.length;
      alert("The stylesheets array length is " + document.styleSheets.length + "\nThe rules array length is " + iRules);
    }
}

function removeTheRule()
{
var iSheets = document.styleSheets.length;
var iRules = (document.styleSheets[iSheets-1].rules) ? document.styleSheets[iSheets-1].rules.length : document.styleSheets[iSheets-1].cssRules.length;
elm = document.getElementById("oEffectRules");

// make sure there is a rule to delete
if (1 < iRules)
    {
      if (document.styleSheets[iSheets-1].removeRule) {document.styleSheets[iSheets-1].removeRule(1);}
      else {document.styleSheets[iSheets-1].deleteRule(1);}
      elm.innerHTML=elm.innerHTML;
      iRules = (document.styleSheets[iSheets-1].rules) ? document.styleSheets[iSheets-1].rules.length : document.styleSheets[iSheets-1].cssRules.length;
      alert("The stylesheets array length is " + document.styleSheets.length + "\nThe rules array length is " + iRules);
    }
}

Jeg er lige på nippet til at kalde dig en knag :o)

Virker helt perfekt! I hvert fald i IE og Firefox. Opera er ikke med, men op i røven med det. Men er det så fordi de også bruger deres egen, og ikke holder sig til den officielle standard??

Men tusind tak! Smid et svar så jeg kan få afregnet min gæld :o)

tja, hvis man skal have det til at virke i opera må man vælge en anden fremgangsmåde. Fx blot at bruge den gode, gamle document.getElementById("elementid").style.fontSize = "18pt". Hvis du er tvivl om hvad firefox understøtter kan du til dels se på den officille standard:
http://www.w3.org/DOM/DOMTR
og en speciel gecko-reference:
http://www.mozilla.org/docs/dom/domref/
Men hvis du har mulighed for at bruge DOM Inspector, så er det også en kanon hjælp til at finde ud af hvad mozilla understøtter af methoder og properties.

og så kan jeg også henvise til microsofts udgave af deres dom-udgave:
http://msdn.microsoft.com/library/default.asp?url=/workshop/author/dhtml/reference/dhtml_reference_entry.asp

hovsa, glemte helt at svare i alt min ivrighed ;-)

og tak for points :-)