← Back to Videos

Thank You and VSL Combo

Created 12/28/2025313 events0 sessionsactive

Preview

Changes reflect live as you adjust settings below

Embed Code

<!-- VSL Player -->
<div data-vsl-video="cmjpa4tha0001c9g5m1p8v3mj" data-vsl-origin="https://vsl-player.alexell.io" data-vsl-api="" style="width: 100%; aspect-ratio: 16/9;"></div>
<script src="https://vsl-embed.alexell.io/embed.min.js" async></script>

Programmatic Usage

// Programmatic usage
const player = new VSLEmbed(
  document.getElementById('player-container'),
  'cmjpa4tha0001c9g5m1p8v3mj',
  {
    playerOrigin: 'https://vsl-player.alexell.io',
    apiBase: '',
    config: {}
  }
);

// Events
player.on('play', () => console.log('Playing'));
player.on('pause', () => console.log('Paused'));
player.on('progress', ({ milestone }) => console.log(`Reached ${milestone}%`));
player.on('timedevent', ({ eventType, eventData }) => {
  // Handle timed events (show CTA, fire pixel, etc.)
});
player.on('seekblocked', () => {
  // User tried to skip ahead
});
player.on('float', ({ floating, position }) => {
  // Video entered/exited floating mode
  console.log(floating ? `Floating at ${position}` : 'Back to inline');
});
player.on('floatdismiss', () => {
  // User closed the floating player
});

// Control
player.play();
player.pause();
player.setVolume(0.5);

// Floating player control
player.setFloatingConfig({ position: 'top-right', width: 400 });
player.enableFloating(); // Re-enable after dismiss

Progress Bar Settings

Presets:
0%25%50%75%100%0:001:152:303:455:00Real Video TimeDisplayed Progress0:00 / 0%0:59 / 75%2:26 / 86%5:00 / 100%
Double-click to add points. Right-click to remove. Drag to adjust.
0:00 / 0%
Preview (what viewers see):
Mapping: [0:00: 0%] → [0:59: 75%] → [2:26: 86%] → [5:00: 100%]

Video Info

Cloudflare Video ID

46f61df8463fa07d20ab8737866bb6c7

Account ID

ea07c55eecb19167d09f569683e80275

Timed Events

No timed events configured.