This is not SVG related however it help to answer your question.
As the rule: You can't modified "CSS - class" on the fly.
(But you can do is append a New "class" then using it, (using javascript).
- Get the old, modifiy then delete then append the same one don't work). If
you need the snipnet on how to append CSS on the fly let me know.
Hope this help.
On 4/12/06, G. Wade Johnson <[EMAIL PROTECTED]> wrote:
>
> On Wed, 12 Apr 2006 05:21:08 -0000
> "Anil Kumar Vemu" <[EMAIL PROTECTED]> wrote:
>
> > Hi all,
> >
> > I am relatively new to the SVG technologies. I apologize if this
> > topic has already been discussed earlier but I couldn't find
> > suitable help for me
> > Well, I am trying to display 'selection' of the element on which
> > user has clicked. My SVG contains several path and text elements
> > which have their style defined via 'class' attribute. All my
> > attempts to retrieve the style of the element resulted in a big NO.
> > I was not able to get the existing style data.
>
> You may not need to save the styles. See below
>
> > The whole idea is
> > 1. 'cache' the original style data to a global variable
> > 2. change temporarity to 'RED' fill/ stroke - I should be able to
> > know whether the current element is using fill (closed path) or
> > stroke (just a path like road etc.,)
> > 3. when the user clicks on other element, restore the original
> > style using the value stored in global variable
>
> Since you are talking about using CSS already, you can modify the 'class'
> attribute without knowing anything about previous styles.
>
> Given:
> <style type="text/css">
> hilite { fill: red; opacity: 0.5; }
> </style>
>
> Assuming that your selection code has put the selected element in the
> variable
> 'elem', you can do the following:
>
> var styles = elem.getAttributeNS( null, "class" );
> styles += " hilite";
> elem.setAttributeNS( null, "class", styles );
>
> In your deselection code, you would then do the following (assuming your
> element in 'elem', again):
>
> var styles = elem.getAttributeNS( null, "class" );
> styles = styles.replace( / ?hilite/, "" );
> elem.setAttributeNS( null, "class", styles );
>
> This technique will work if you are using either CSS class or presentation
> attributes for styling yuor elements. If you are using the 'style'
> attribute,
> the value of style will override what is in your highlight.
>
> > The other alternatives of setting opacity for all elements to 0.25
> > and then setting opacity of current element to 1 is not suitable as
> > my class attributes do have opacity which means I am disturbing the
> > original style. Please suggest me on how to achieve the above three
> > steps
>
> If you are setting the opacity as an attribute or in a class, this
> technique
> will still work.
>
> You could also use the above technique to save off the current style (if
> you
> are using the 'style' attribute) and replace it with your highlighted
> style.
> Personally, I try to avoid the 'style' attribute, but it would work.
>
> G. Wade
> --
> That's what I love about GUIs: They make simple tasks easier, and complex
> tasks impossible.
> -- John William Chambless, <[EMAIL PROTECTED]>
>
>
> -----
> To unsubscribe send a message to:
> [EMAIL PROTECTED]
> -or-
> visit http://groups.yahoo.com/group/svg-developers and click "edit my
> membership"
> ----
> Yahoo! Groups Links
>
>
>
>
>
>
>
[Non-text portions of this message have been removed]
-----
To unsubscribe send a message to: [EMAIL PROTECTED]
-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/
<*> To unsubscribe from this group, send an email to:
[EMAIL PROTECTED]
<*> Your use of Yahoo! Groups is subject to:
http://docs.yahoo.com/info/terms/