7 Replies Latest reply: May 29, 2014 10:47 PM by hemanth kumar r

How to apply CSS class to a symbol/element in code?

Frantiseks May 29, 2014 3:24 AM

Hi guys,

just trying to find out how to apply a CSS class to a symbol or an element using the code only, so not using Animate. Is there a way for doing this or do I have to style elements either using inline styling or by applying the class in Animate? I'd like to be able to change classes of symbols and elements on various events and this would certainly help a lot. Thanks in advance ;-).

Cheers.

1. Re: How to apply CSS class to a symbol/element in code?

Preran May 29, 2014 5:37 AM (in response to Frantiseks)

Hi Frantiseks,

Can you let us know if this discussion helps?

Re: How to add css styling to Edge Animate elements?

Thanks,
Preran
Like Show 0 Likes (0)

Actions
2. Re: How to apply CSS class to a symbol/element in code?

Frantiseks May 29, 2014 5:57 AM (in response to Preran)

No it does not. I've searched this forum first before I asked and I didn't find the answer I was after.

What I would like to be able to do is something like this:

sym.getSymbol("symbol1").$("element1").class("cssClassName");

Is there a way to apply CSS classes to symbols and elements in Animate?
Like Show 0 Likes (0)

Actions
3. Re: How to apply CSS class to a symbol/element in code?

Preran May 29, 2014 6:00 AM (in response to Frantiseks)

Hi Frantiseks,

I have reached out to people that can help. Meanwhile, the experts on the forum should be able to help you as well. Stay tuned.

Thanks,
Preran
Like Show 0 Likes (0)

Actions
4. Re: How to apply CSS class to a symbol/element in code?

resdesign May 29, 2014 6:05 AM (in response to Preran)

You can use addClass and then you do you need a period before the class name.
sym.getSymbol("symbol1").$("element1").addClass("cssClassName");
sym.$(".cssClassName")....
Like Show 0 Likes (0)

Actions
5. Re: How to apply CSS class to a symbol/element in code?

Frantiseks May 29, 2014 6:11 AM (in response to resdesign)

I've tried that too and it didn't work. Perhaps because I didn't use the second line => sym.$(".cssClassName") which I don't understand honestly. What's that supposed to do?

I'm also sceptical about addClass functionality. What does it do? If I use addClass in the initial call, can I call it again on the same element with a different class the same way I would do in the regular HTML/CSS? Wouldn't it clutter the code if the user called it several times during the session, because the name suggests that it adds new lines of code to the element rather than replace the previous ones.
Like Show 0 Likes (0)

Actions
6. Re: How to apply CSS class to a symbol/element in code?

resdesign May 29, 2014 9:01 AM (in response to Frantiseks)

You can use removeClass as well if you need to. In general if the element has a class you can use it when needed. If you want to change the class then use removeClass and add new class.

—
Sent from Mailbox

On Thu, May 29, 2014 at 8:12 AM, Frantiseks <forums_noreply@adobe.com>
Like Show 0 Likes (0)

Actions
7. Re: How to apply CSS class to a symbol/element in code?

hemanth kumar r May 29, 2014 10:47 PM (in response to Frantiseks)

addClass is a jquery function read about it here .addClass() | jQuery API Documentation
sym.$(".cssClassName") : This call returns the jquery element with class name 'cssClassName '
Content published my Animate is also regular HTML and JS.SO what ever operations you perform on regular HTML must also work in Animate.
Like Show 0 Likes (0)

Actions