Play Youtube or Vimeo Videos On Popup – Modal Video Library

In this tutorial I am going to share awesome jQuery plugin which help you to add Youtube / Vimeo videos on popup modal. just few configuration your can simply add videos player on any HTML link when ever your visitor will click on that link a popup modal will open with video.

Plugin Features:

• Not affected by dom structure.
• Beautiful transition
• Accessible for keyboard navigation and screen readers.
• Rich options for youtube API and Vimeo API

Integrate Youtube or Vimeo Popup video player

Libraries

Include required plugins libraries along with latest jQuery Library.

<link rel="stylesheet" href="modal-video.min.css">
 

<script src="//code.jquery.com/jquery-latest.min.js">script>
<script src="modal-video.min.js">script>

HTML

Create demos link for Vimeo and Youtube video player and set video id by data-video-id attribute.

JS

Finally enable youtube and Vimeo player modal on link click.

       <script>
            $(function() {  
		$(".vimeo-video-player").modalVideo({channel:'vimeo'});
		$(".youtube-video-player").modalVideo();
            });
	script>

See live demos and download source code.

Visit official github repository for more information and follow for future updates. Don’t forget to read license for using this plugin in your projects.

Related