Hi all...
This one has been racking my brain for the past week, I just cant resolve the issue.
Please see my JSFIDDLE You will see some text animate back and forth, you will also notice that it starts at the start of the text and ends at the end of the text due to the use of "translateX(254px)" (254px is the width of my container) So i can change the length of the text within the container and it will ALWAYS animate as expected.
I am trying to re-create this animation within my edge composition. The text that moves back and forth is DYNAMIC json (changes periodically in length of characters) so there is no fixed width of the data, While this works fine in HTML & CSS implimenting this into an edge composition it seems is impossible. The text WILL NOT animate as expected.
I have re-created this in Edge, please see my EDGE EXAMPLE it is created exactly as the JSFIDDLE example is but within an Edge Composition.
I have a symbol called "titleContainer" which is set to the width of 254px, within this symbol i have a div called "titleData" created from a textbox which is also set to the width of 254px. The div "titleData" has the class ".animate" assigned to it from the file "addcss.css"
Now i would expect an animation to occur just like in the JSFIDDLE but nothing happens. I believe everything is set correctly. Both examples are clean and tidy so troubleshooting should hopefully easy enough.
I hope the fiddle visualises exactly what i require and i have explained myself clearly, if anybody could shed some light on this Please, your comments are greatly appreciated!
many thanks
Justin..