Skip to main content
Participating Frequently
March 14, 2025
Question

Smooth infinity Scrolling text with any size of text length for a Novice template.

  • March 14, 2025
  • 1 reply
  • 175 views

I'm using the code below to create a ticker tape that runs along the bottom of the screen in an After Effects template. This template is for a client who is a novice in After Effects and only needs to update the text—without dealing with layer duplications, keyframes, or other complexities.

I want the text to scroll continuously, with only two spaces before it repeats, regardless of its length (as long as it fits in the composition). The current code works well (see the YouTube link below for an example), but the motion isn't smooth because the speed is based on characters per second, which creates a jittery effect.

I need a modified version of the code where the speed is determined by pixels per second instead of characters per second, ensuring smooth movement. Any help would be greatly appreciated!

// Scrolling Text Variables

var scrollSpeed = 5;  // Characters per second

var displayLength = 20;  // Number of characters to display at once

// Source text initialization

var textToScroll = thisLayer.text.sourceText.value + "          ";  // Adding spaces for separation at loop point

// Extend the text by repeating it based on the need for smooth looping

var repeatTimes = 3; // Adjust based on needs

var fullText = textToScroll.repeat(repeatTimes);

// Calculate current position in the scrolling text

var frameOffset = Math.floor(time * scrollSpeed) % fullText.length;

var displayText = fullText.substring(frameOffset, Math.min(frameOffset + displayLength, fullText.length));

// Display text with limited characters

displayText;


https://www.youtube.com/watch?v=JW2qB6DB1TQ

1 reply

ShiveringCactus
Community Expert
Community Expert
March 14, 2025

That's an interesting way to do scrolling text.  Personally if I am using movement, I'd probably just keyframe the position.  That gives me a lot more control.  

To get infinity scrolling text, if you use an expression like this on the sourceText property:

txt = "Create Smooth Scrolling Text in After Effects | Easy Tutorial";
txt += "  "+txt;
txt;

And this on your position:

loopOut("cycle")

Set the final keyframe to line the text up so that it matches the starting position of the first keyframe (just a complete sentence further along).  Then you should get a nicely scrolling, repeating text scroll that you can control the speed of.