Skip to content

Instantly share code, notes, and snippets.

@calvinte
Created November 10, 2012 05:38
Show Gist options
  • Save calvinte/4050040 to your computer and use it in GitHub Desktop.
Save calvinte/4050040 to your computer and use it in GitHub Desktop.
jQuery dosen't like SVG css properties like 'fill' and 'stop-opacity' so, I wrote this to piggyback it with my own. @todo make this into a proper jQuery library.
/**
* Function takes the style attribute and generates an object that
* represents it's CSS properties.
* @param styleAttr as String
* @return style as Object
*/
getStyle = function(styleAttr) {
var style = {};
styleAttr = styleAttr.split(';');
for (var i = 0; i < styleAttr.length; i++) {
var property = styleAttr[i];
if (property == '') continue;
property = property.split(':');
style[property[0]] = property[1];
}
return style;
}
/**
* Function takes an Object representing css and converts it into a
* String for use as the 'style' HTML attribute.
* @param style as Object
* @return styleAttr as String
*/
getStyleAttr = function(style) {
var styleAttr = '';
for (property in style) {
styleAttr += property + ':' + style[property] + ';';
}
return styleAttr;
}
// Example.
var styleArr = $('svg stop').attr(style),
style = getStyle(styleArr);
style['stop-color'] = '#FF00FF';
$('svg stop').attr(style, getStyleAttr(style));
Sign up for free to join this conversation on GitHub. Already have an account? Sign in to comment