"MediaElement.js 유튜브 예시"의 두 판 사이의 차이

2021년 5월 30일 (일) 17:15 기준 최신판

1 개요[ | ]

MediaElement.js 유튜브 예시

<link rel="stylesheet" href="//cdnjs.cloudflare.com/ajax/libs/mediaelement/4.2.16/mediaelementplayer.min.css">
<video id="youtube1" width="640" height="360">
    <syntaxhighlight type="video/youtube" src="http://www.youtube.com/watch?v=gdZLi9oWNZg">
</video>

<script src="//cdnjs.cloudflare.com/ajax/libs/mediaelement/4.2.16/mediaelement-and-player.min.js"></script>
<script>
var player = new MediaElementPlayer('youtube1')
</script>

2 같이 보기[ | ]

MediaElement.js

3 참고[ | ]

https://jsfiddle.net/jmnote/mevuksx8/

@@ 2번째 줄: / 2번째 줄: @@
 ;MediaElement.js 유튜브 예시
-<source lang='html' run outheight='400'>
+<syntaxhighlight lang='html' run outheight='400'>
-<link rel="stylesheet" href="https://cdnjs.cloudflare.com/ajax/libs/mediaelement/2.13.2/css/mediaelementplayer.min.css" />
+<link rel="stylesheet" href="//cdnjs.cloudflare.com/ajax/libs/mediaelement/4.2.16/mediaelementplayer.min.css">
 <video id="youtube1" width="640" height="360">
-     <source type="video/youtube" src="http://www.youtube.com/watch?v=gdZLi9oWNZg">
+     <syntaxhighlight type="video/youtube" src="http://www.youtube.com/watch?v=gdZLi9oWNZg">
 </video>
-<script src="https://cdnjs.cloudflare.com/ajax/libs/jquery/3.5.1/jquery.slim.min.js" integrity="sha512-/DXTXr6nQodMUiq+IUJYCt2PPOUjrHJ9wFrqpJ3XkgPNOZVfMok7cRw6CSxyCQxXn6ozlESsSh1/sMCTF1rL/g==" crossorigin="anonymous"></script>
+<script src="//cdnjs.cloudflare.com/ajax/libs/mediaelement/4.2.16/mediaelement-and-player.min.js"></script>
-<script src="https://cdnjs.cloudflare.com/ajax/libs/mediaelement/2.13.2/js/mediaelement-and-player.min.js"></script>
 <script>
-MediaElementPlayer('#youtube1');
+var player = new MediaElementPlayer('youtube1')
 </script>
-</source>
+</syntaxhighlight>
 ==같이 보기==