Crawl Text

Crawl text creates a scrolling text overlay at the bottom of the video, similar to news tickers or credits.

Crawl Text Example

Enable crawl text by providing the crawl option with your text and styling preferences.

Setup Code

const mediaSource = {
  id: 'crawl-demo',
  src: 'https://test-streams.mux.dev/x36xhzz/x36xhzz.m3u8',
  type: 'application/x-mpegURL',
  title: 'Video with Crawl Text'
};

const options = {
  showCrawl: true,           // Display the crawl text
  crawl: {
    text: 'Your scrolling message here', // The text to display
    speed: 10,               // Scrolling speed
    backgroundColor: '#000000', // The background color
    textColor: '#FFFFFF' // The text color
  }
};

player.setup(mediaSource, options);

Configuration Options

The crawl option accepts the following properties:

• text (string) - The scrolling text content
• speed (number) - Animation interval in milliseconds. Lower values create faster scrolling (e.g., 20 = fast, 100 = slow)
• backgroundColor (string) - Background color (CSS color values)
• textColor (string) - Text color (CSS color values)