Smooth infinity Scrolling text with any size of text length for a Novice template.
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;
