Installation:

# Yarn
$ yarn add modal-video

# NPM
$ npm install modal-video --save

1. Put each jQuery library and the jQuery modal-video plugin’s information on the bottom of the HTML web page.

<script src="//code.jquery.com/jquery-3.6.0.slim.min.js"></script>
<script src="modal-video.min.js"></script>
<link rel="stylesheet" href="modal-video.min.css">

2. Create a video link and specify the video ID utilizing the ‘data-video-id’ attribute like this:

<a href="#" class="js-video-button" data-video-id=' '>Yotube Video</a>

3. Initialize the plugin and completed it.

$(".js-video-button").modalVideo();

4. The plugin additionally works with Vimeo videos:

<a href="#" 
   class="js-video-button" 
   data-video-id=' ' 
   data-channel="vimeo"> 
</a>

// or 
$(".js-video-button").modalVideo({
  channel:'vimeo'
});

5. Config the Youtube/Vimeo player:

$(".js-video-button").modalVideo({
  channel: 'youtube',
  youtube: {
    autoplay: 1,
    cc_load_policy: 1,
    color: null,
    controls: 1,
    disablekb: 0,
    enablejsapi: 0,
    end: null,
    fs: 1,
    h1: null,
    iv_load_policy: 1,
    list: null,
    listType: null,
    loop: 0,
    modestbranding: null,
    origin: null,
    playlist: null,
    playsinline: null,
    rel: 0,
    showinfo: 1,
    start: 0,
    wmode: 'transparent',
    theme: 'dark'
  },
  ratio: '16:9',
  vimeo: {
    api: false,
    autopause: true,
    autoplay: true,
    byline: true,
    callback: null,
    color: null,
    height: null,
    loop: false,
    maxheight: null,
    maxwidth: null,
    muted: false,
    player_id: null,
    portrait: true,
    title: true,
    width: null,
    xhtml: false
  },
});

6. Config the video modal:

$(".js-video-button").modalVideo({
  allowFullScreen: true,
  animationSpeed: 300,
  classNames: {
    modalVideo: 'modal-video',
    modalVideoClose: 'modal-video-close',
    modalVideoBody: 'modal-video-body',
    modalVideoInner: 'modal-video-inner',
    modalVideoIframeWrap: 'modal-video-movie-wrap',
    modalVideoCloseBtn: 'modal-video-close-btn'
  },
  aria: {
    openMessage: 'You just openned the modal video',
    dismissBtnMessage: 'Close the modal by clicking here'
  }
});

Minimal Youtube/Vimeo Modal Plugin, Modal Video Github

See Demo And Download