Get started with mediaelement CDN

MIT licensed

MediaElement.js: HTML5 video player solution for devs - full-screen, multiple formats, JS integration.

Tags:
  • video
  • player
  • html5

Stable version

Copied!

How to start using mediaelement CDN


<!DOCTYPE html>
<html>
<head>
    <title>Get started with mediaelement CDN - cdnhub.io</title>
    <link rel="stylesheet" href="https://cdnjs.cloudflare.com/ajax/libs/mediaelement/7.0.3/mediaelementplayer.min.css">
    <script src="https://cdn.cdnhub.io/mediaelement/7.0.3/mediaelement.min.js"></script>
</head>
<body>
    <video id="videoElement" width="320" height="240" controls>
        <source src="path/to/your/video.mp4" type="video/mp4">
        <source src="path/to/your/video.ogg" type="video/ogg">
        Your browser does not support the video tag.
    </video>

    <script>
        document.addEventListener('DOMContentLoaded', function() {
            var video = document.getElementById('videoElement');
            if (!('mediaElement' in video)) {
                console.log('MediaElement.js is not supported by your browser.');
                return;
            }

            video.addEventListener('canplay', function() {
                var player = new MEJS.Player(video);
            });
        });
    </script>
</body>
</html>
Copied!
Copied!
Copied!
Copied!
Copied!
Copied!
Copied!
Copied!
Copied!
Copied!
Copied!
Copied!
Copied!
Copied!
Copied!
Copied!
Copied!
Copied!
Copied!
Copied!
Copied!
Copied!
Copied!
Copied!
Copied!
Copied!
Copied!
Copied!
Copied!
Copied!
Copied!
Copied!
Copied!
Copied!
Copied!
Copied!
Copied!
Copied!
Copied!
Copied!
Copied!
Copied!
Copied!
Copied!
Copied!
Copied!
Copied!
Copied!
Copied!
Copied!
Copied!
Copied!
Copied!
Copied!
Copied!
Copied!
Copied!
Copied!
Copied!
Copied!
Copied!
Copied!
Copied!
Copied!
Copied!
Copied!
Copied!
Copied!
Copied!

All versions