1
0
Fork 0
mirror of https://github.com/xbgmsharp/videojs-rotatezoom synced 2025-10-06 03:50:11 +02:00

Update example for VideoJS v5

This commit is contained in:
xbgmsharp 2016-06-06 09:14:11 +01:00
parent 79215b76e2
commit d0fb4bcd3c

View file

@ -1,16 +1,27 @@
<!DOCTYPE html> <!DOCTYPE html>
<html> <html lang="en">
<head> <head>
<link href="../video-js/video-js.css" rel="stylesheet"> <meta charset="utf-8" />
<script src="../video-js/video.dev.js"></script> <title>Video.js Zoom Rotate Example</title>
<link href="../video.js/video-js.css" rel="stylesheet">
<script src="../video.js/video.js"></script>
<script> <script>
videojs.options.flash.swf = "../video-js/video-js.swf" videojs.options.flash.swf = "../video.js/video-js.swf"
</script> </script>
<!-- <script src="../videojs.zoomrotate.js"></script> --> <!-- <script src="../videojs.zoomrotate.js"></script> -->
<!-- For debugging --> <!-- For debugging -->
<script src="../src/videojs.zoomrotate.js"></script> <script src="../src/videojs.zoomrotate.js"></script>
<style>
p {
background-color: #eee;
border: thin solid #777;
padding: 10px;
}
</style>
</head> </head>
<body> <body>
<p>The zoomrotate plugin rotate the poster and the video. Give it a shot:</p>
<video id="video_1" class="video-js vjs-default-skin" controls preload="auto" width="640" height="360" data-setup='{"rotate": "90", "zoom": "1.5"}'> <video id="video_1" class="video-js vjs-default-skin" controls preload="auto" width="640" height="360" data-setup='{"rotate": "90", "zoom": "1.5"}'>
<source src="http://www.archive.org/download/AnimatedMechanicalArtPiecesAtMit/P1120973_512kb.mp4" type="video/mp4"> <source src="http://www.archive.org/download/AnimatedMechanicalArtPiecesAtMit/P1120973_512kb.mp4" type="video/mp4">
<source src="http://www.archive.org/download/AnimatedMechanicalArtPiecesAtMit/P1120973.ogv" type="video/ogg"> <source src="http://www.archive.org/download/AnimatedMechanicalArtPiecesAtMit/P1120973.ogv" type="video/ogg">