GitHub :- https://github.com/openplayerjs/openplayerjs/
OpenPlayerJS :- https://www.openplayerjs.com/
Video
<link rel="stylesheet" href="https://cdn.jsdelivr.net/npm/openplayerjs@latest/dist/openplayer.min.css" />
<!-- Adding Css CDN -->
<video class="op-player__media" id="player" controls playsinline width="100%">
<source src="https://archive.org/download/sample-video_202306/SampleVideo.mp4" type="video/mp4" />
</video>
<hr>
<script src="https://cdn.jsdelivr.net/npm/openplayerjs@latest/dist/openplayer.min.js"></script>
<!-- Adding JavaScript CDN -->
<script>
// Check the `API and events` link below for more options
const player = new OpenPlayerJS('player');
player.init();
</script>
Audio
<link rel="stylesheet" href="https://cdn.jsdelivr.net/npm/openplayerjs@latest/dist/openplayer.min.css" />
<!-- Adding Css CDN -->
<audio class="op-player__media" id="aud2" controls>
<source src="https://archive.org/download/sample-video_202306/SampleVideo.mp4" type="audio/ogg">
</audio>
<hr>
<script src="https://cdn.jsdelivr.net/npm/openplayerjs@latest/dist/openplayer.min.js"></script>
<!-- Adding JavaScript CDN -->
<script>
// Check the `API and events` link below for more options
const player2 = new OpenPlayerJS('aud2');
player2.init();
</script>
YouTube Video
<link rel="stylesheet" href="https://cdn.jsdelivr.net/npm/openplayerjs@latest/dist/openplayer.min.css" />
<!-- Adding Css CDN -->
<video class="op-player__media" id="player3" controls playsinline width="100%">
<source src="https://www.youtube.com/watch?v=xcJtL7QggTI" type="video/x-youtube" />
</video>
<hr>
<script src="https://cdn.jsdelivr.net/npm/openplayerjs@latest/dist/openplayer.min.js"></script>
<script src="https://cdn.jsdelivr.net/npm/openplayerjs-youtube@2.3.0/dist/openplayerjs-youtube.min.js"></script>
<!-- Adding JavaScript CDNs (YouTube CDN Added) -->
<script>
// Check the `API and events` link below for more options
const player3 = new OpenPlayerJS('player3');
player3.init();
</script>
iframe
<iframe src="https://www.openplayerjs.com/embed.html?file=https%3A%2F%2Farchive.org%2Fdownload%2Fsample-video_202306%2FSampleVideo.mp4&type=video&autoplay=true" style="width:100%;height:700px" frameborder="0" allow="fullscreen"></iframe>
Create Your iframe code Here :- https://www.openplayerjs.com/#try
Checkout the Demo Below :-
Comments