That's been a real help, thanks so much Ant
On Jan 15, 4:36 pm, Ricardo Tomasi <ricardob...@gmail.com> wrote: > appendChild on a <style> element fails on IE and you get an "unknown > error" if you try to modify it's innerHTML. I haven't found any > workaround. > > Use this to add styles: > > //addStyles 0.1 > // Ricardo Tomasi < ricardobeat at gmail com > > // Licensed under the WTFPL -http://sam.zoy.org/wtfpl/ > function addStyles(rule){ > var sheet = document.styleSheets[0], > ln = (sheet.cssRules||sheet.rules).length; > if (sheet.addRule) { > rule = rule.match(/(.*){(.*)}/); > sheet.addRule(rule[1],rule[2], ln); > } else { > sheet.insertRule(rule, ln); > }; > return arguments.callee;}; > > addStyle("#div{display:none}"); > > the 'return arguments.callee' line is there to allow for some funky > construction, you can remove it if you want: > > addStyle > ('div { background: xxx }') > ('.menu { whatever: #45 }') > ('.hold { float: left }') > > This script will insert rules at the end of the stylesheet, that's > important so that you can override earlier styles. > > cheers, > - ricardo > > On Jan 15, 8:07 am, Ant <kalli...@gmail.com> wrote: > > > Hi, > > Yea, I went for adding a new style element for every new style, which > > works, but isn't as neat as I was hoping for. > > I was trying to append a string into the style element: > > HTML > > <style type="text/css"> > > body{color:#333;} > > </style> > > JS > > $("style").append("#content{color:#f00;}"); > > In Firefox, this adds #content(color:#f00;} beneath the body > > declaration. > > Which is what I would expect to happen. > > In IE I get an error thrown in jquery-1.3b2.js > > > It may well be that my expectations of append are wrong, if so, it > > would be a useful thing for me to know as I am quite new to jQuery. > > Many thanks for your time, > > Ant > > > Ricardo Tomasi wrote: > > > What are you trying to append? You can only append textnodes to a > > > style element. > > > > Why not use the stylesheet object directly: > > > > document.styleSheets[0].insertRule("#wrapper {display:none}", 0) // > > > 'addRule' on IE > > > > Or, for a hassle-free alternative, create a new style element for it: > > > > $('<style type="text/css"></style>').text(myClass).appendTo('head'); > > > > On Jan 14, 12:05 pm, Ant <kalli...@gmail.com> wrote: > > > > Hi, > > > > I am trying to append css into a pre existing style element. > > > > $("style").append(myClass); > > > > This works as expected in Firefox, but not IE. > > > > The HTML on the page validates to HTML strict, so I'm fairly sure that > > > > it's not the issue with IE that append() won't work on incorrectly > > > > written elements. > > > > If I change my code to $("p").append(myClass); it works as expected. > > > > > Was just wondering if this is a know issue with IE or jQuery and if > > > > anyone had a work around, I am out of ideas that don't involve > > > > considerable effort :) > > > > > Thanks, > > > > Ant