Rather than changing the style of each individual circle, one could change them using a style element, like so:
<?xml version="1.0" encoding="UTF-8"?> <!DOCTYPE svg PUBLIC "-//W3C//DTD SVG 1.1//EN" "http://www.w3.org/Graphics/SVG/1.1/DTD/svg11-flat-20030114.dtd";> <svg xmlns="http://www.w3.org/2000/svg"; xmlns:xlink="http://www.w3.org/1999/xlink"; onload="init(evt)"> <script type="text/javascript"><![CDATA[ var style; function init(evt){ style = document.getElementById('dynamicStyle'); var _SVGNS_ = "http://www.w3.org/2000/svg";; for(i=0;i<60;i++){ for(j=0;j<50;j++){ var group=document.createElementNS(_SVGNS_,"g"); group.setAttributeNS(null,'transform','translate('+(i*10)+','+(j*10+50)+')'); var circle=document.createElementNS(_SVGNS_,"circle"); circle.setAttributeNS(null,'r',2); group.appendChild(circle); evt.target.appendChild(group); } } } function setCircleDisplayProperty(propertyValue){ style.textContent = "circle{display:" + propertyValue + "}"; } ]]></script> <style type="text/css" id="dynamicStyle"/> <rect width="60" height="40" fill="red" onclick="setCircleDisplayProperty('inherit')"/> <rect x="70" width="60" height="40" fill="blue" onclick="setCircleDisplayProperty('none')"/> </svg> Try it here: http://jsbin.com/ejasof/1/ It seems to work a tiny bit faster in Firefox. ------------------------------------ ----- To unsubscribe send a message to: svg-developers-unsubscr...@yahoogroups.com -or- visit http://groups.yahoo.com/group/svg-developers and click "edit my membership" ----Yahoo! Groups Links <*> To visit your group on the web, go to: http://groups.yahoo.com/group/svg-developers/ <*> Your email settings: Individual Email | Traditional <*> To change settings online go to: http://groups.yahoo.com/group/svg-developers/join (Yahoo! ID required) <*> To change settings via email: svg-developers-dig...@yahoogroups.com svg-developers-fullfeatu...@yahoogroups.com <*> To unsubscribe from this group, send an email to: svg-developers-unsubscr...@yahoogroups.com <*> Your use of Yahoo! Groups is subject to: http://docs.yahoo.com/info/terms/
