raugert
Content Type
Profiles
Forums
Store
Blog
Product
Showcase
FAQ
Downloads
Posts posted by raugert
-
-
Hi, I'm new at Greensock but very impressed with what it can do ! I'm also fairly new at coding but I catch on quick.
I'm trying to create a news style ticker for a Telethon using GSAP. Here's what I've tried :
I read a small .csv file into a <div> called "scrolltext"
Then I use simple TimelineLite and SplitText commands:
tl = new TimelineLite(),
Split = new SplitText("#scrolltext", {type:"lines", linesClass:"scroll"}),lines = Split.lines;tl.staggerTo(lines, 10, {x:-1920}, 2)
This works... but scrolls each line of text at the vertical position of each child element that it created with SplitText. Is there a way to scroll all the child elements on the same line for the news ticker ? Do I have to change the DOM child elements properties somehow, or can it be done using GSAP ?
thanks for your help,
Richard
Can I use SplitText to scroll a news style ticker on a single line
in GSAP
Posted
Thanks for the quick reply PointC.
You're right, SplitText is probably not the right tool for the news ticker. I've done it just by using TweenMax and scrolling the single element containing the html.text string which also includes images. It works well that way, but I thought I would use SplitText to parse out the lines and images.
I could then potentially add some animations to the embedded images or change the text properties of each line if I wanted to. It's really not necessary at all , but I thought I would play around with it. I'll stay focused on the simple ticker for now. I just got a little excited when I saw what SplitText could do.
I've never used codePen before, but I will start using it to illustrate next time.
thanks again.