Videojs Trailer Plugin

One time fee € 10.00

Add to cart Buy now

Trailer plugin for Videojs version 6 or 7

Trailer plugin is what you can often see on TV. It shows small video preview window in bottom right corner with trailer of upcoming film, video or a show.
Trailer preview is mute. Trailer preview window appears at the time defined by the user, counting from the end time of main video. User can define video title and URL to go for "Watch now" button. By default preview video is looped.
Chack options below:
  • src - media file url (mp4, webm) - required
  • url - url to go on button click
  • title - trailer video title
  • offset - time offset from the end of the main video to show trailer (seconds). Read more below.
  • loop - set false to abort trailer video loop plaback and close it on trailer end.
Code snippet

// Load player and trailer plugin css stylesheet file
<link href="https://vjs.zencdn.net/7.6.0/video-js.css" rel="stylesheet">
<link href="//www.domain.com/videojs/plugins/videojs.trailer.css" rel="stylesheet" type="text/css">

// Load player and trailer plugin javascript files
<script src='https://vjs.zencdn.net/7.6.0/video.js'></script>
<script src="//www.domain.com/videojs/videojs.trailer.js"></script>

// Setup video tag with media file(s)
<video id="video_1" class="video-js vjs-fluid" controls preload='auto' width="640" height="264"> poster="VIDEO_POSTER.jpg"
<source src="VIDEO.mp4" type="video/mp4">
</video>

// Initialize player and trailer plugin
<script>
var player = videojs('video_1');
player.trailer({
	src: my_trailer.mp4,
	title: 'trailer_title',
	url: 'website url to go'
	offset: 60
});
</script>

About trailer time offset

If you do not set any time offset for trailer video, the time to show trailer will be calculated from the end of main videos and the length of trailer video.
For example if main video is 180 seconds and trailer video is 30 seconds, it will appear at 02:30 time of main video (180-30).
If you set some some number of seconds for time offset option, video trailer will start playing based on calculation: main video length minus time offset value.
In example above trailer video is about 30 seconds long and offset value=60. So it starts playing about 01:54 time of main video and is looped if only main video is still playing.