dynamic change of internal stylesheet

• From: marcel salathe <marcel@salathe.com>
• Date: Tue, 17 Jul 2001 10:39:10 +0200
• To: www-svg@w3.org
• Message-ID: <3B53F9AE.3385430@salathe.com>

How can I dynamically change an internal stylesheet?

I know that changing properties with javascript is straighforward

var SVGDoc = document['whatever'].getSVGDocument();
var myObj = SVGDoc.getElementById('anyElement');
var myObjStyle = myObj.getStyle();
myObjStyle.setProperty ('fill', 'green');

if the attribute style is defined in an element:

<rect id="anyElement" x="0" y="0" width="100" height="100"
style="fill:blue;"/>

But what if styles are defined like this:

<svg>
<style id="myStyle1" type="text/css"><![CDATA[
rect {
fill:blue;
}
]]></style>
<rect x="0" y="0" width="100" height="100"/>
</svg>

I can read the information:

var SVGDoc = document['whatever'].getSVGDocument();
var myObj2 = SVGDoc.getElementById('myStyle1');
var myTextNode = myObj2.getFirstChild();
var myValue = myTextNode.getData();

but

myTextNode.setData('rect{fill:green;}');

does not have any effect.

any ideas?

marcel

Received on Tuesday, 17 July 2001 04:40:28 UTC