diff options
author | wout <wout@impinc.co.uk> | 2014-06-22 11:10:53 +0200 |
---|---|---|
committer | wout <wout@impinc.co.uk> | 2014-06-22 11:10:53 +0200 |
commit | ec21f496bddc588e2113fd5418d713ce8ae78f39 (patch) | |
tree | faf793ba701504e3eaf10a6a4a04367e2f319800 | |
parent | c168777a82c9dd81af36cb7f7d4948c148403ea0 (diff) | |
download | svg.js-ec21f496bddc588e2113fd5418d713ce8ae78f39.tar.gz svg.js-ec21f496bddc588e2113fd5418d713ce8ae78f39.zip |
Updated README
-rwxr-xr-x | README.md | 18 |
1 files changed, 7 insertions, 11 deletions
@@ -752,35 +752,31 @@ var element = SVG.get('my_element') element.fill('#f06') ``` -### By CSS selector +### Using CSS selectors There are two ways to select elements using CSS selectors. The first is to search globally. This will search in all svg elements in a document and return them in an instance of `SVG.Set`: ```javascript -var elements = SVG.select('rect.my-class') - -elements.fill('#f06') +var elements = SVG.select('rect.my-class').fill('#f06') ``` The second is to search within a parent element: ```javascript -var elements = group.select('rect.my-class') - -elements.x(100) +var elements = group.select('rect.my-class').fill('#f06') ``` ### Using jQuery -There is no DOM querying system built into svg.js but [jQuery](http://jquery.com/) or [Zepto](http://zeptojs.com/) will help you achieve this. Here is an example: +Another way is to use [jQuery](http://jquery.com/) or [Zepto](http://zeptojs.com/). Here is an example: ```javascript /* add elements */ var draw = SVG('drawing') -var group = draw.group().attr('class', 'my-group') -var rect = group.rect(100,100).attr('class', 'my-element') -var circle = group.circle(100).attr('class', 'my-element').move(100, 100) +var group = draw.group().addClass('my-group') +var rect = group.rect(100,100).addClass('my-element') +var circle = group.circle(100).addClass('my-element').move(100, 100) /* get elements in group */ var elements = $('#drawing g.my-group .my-element').each(function() { |