Jump to content


GSAP TweenMax news ticker - NON-Flash

Recommended Posts

I need to do a small "news ticker" type animation - it would just consist of text scrolling along a single line. I spent a considerable amont of time looking around for somethig like this, and all of the references I found were either old Flash-based things, or jQuery code that is many years old.


Is there a simple way to use Tweenmax to create a horizontal text scroller?  Ideally, I'd like it to just use a bunch of <li> elements as sequential text scrolls.



Link to comment
Share on other sites

Hey Diaco - awesome as always. :)


That's really cool that it only has 3 lines of JavaScript.


I look at some of your pens and think "It can't possibly be that easy" , but there it is working beautifully every time.



  • Like 4
Link to comment
Share on other sites

PS - @flash08


When you read these answers, you should also read this thread:




It has a good discussion of getting the ticker to run smoothly in all browsers. In particular, you'll see Jonathan has set the z rotation on his pen to 0.01 to help with this.



  • Like 3
Link to comment
Share on other sites

Thanks to all! I am just AMAZED at what GSAP can do!

Link to comment
Share on other sites

  • 1 year later...

Hello.  Lurking and learning GSAP.  Diaco has a codepen earlier in this thread which I've been toying with.  How do you slow it down?  Do you use the timescale?

Link to comment
Share on other sites

  • Carl changed the title to GSAP TweenMax news ticker - NON-Flash

You could change the duration by changing the 30 into 60.

Once the tween is created you can change the duration() or timeScale() but you need to create a reference to the tween like:


var t = TweenMax.to('.topics',30,{x:-topics.offsetWidth,repeat:-1,ease:Linear.easeNone});




  • Like 1
Link to comment
Share on other sites

Create an account or sign in to comment

You need to be a member in order to leave a comment

Create an account

Sign up for a new account in our community. It's easy!

Register a new account

Sign in

Already have an account? Sign in here.

Sign In Now
  • Recently Browsing   0 members

    • No registered users viewing this page.