File: /var/www/html/tmpr/..//tmpr/../tmpr/../tmpr/..//tmpr/../tmpr/..//real/video.html
<script src="js/jquery.min.js"></script>
<script src="js/mediaelement-and-player.min.js"></script>
<link rel="stylesheet" href="css/video.css" media="screen">
<style type="text/css">
.mejs-container { margin: 0 auto; } body {
margin-left: 0px;
margin-top: 0px;
margin-right: 0px;
margin-bottom: 0px;
}
</style>
<video width="100%" height="100%" poster="media/cars.png">
<source src="media/cars.mp4" type="video/mp4">
</video>
<script>
$(document).ready(function() {
$('video').mediaelementplayer({
alwaysShowControls: false,
videoVolume: 'horizontal',
features: ['playpause','progress','volume','fullscreen']
});
});
</script>
<div class="audio-player" style="width:400px">
<h1>Demo - Preview Song</h1>
<img class="cover" src="img/cover.png" alt="">
<audio id="audio-player" src="media/demo.mp3" type="audio/mp3" controls="controls"></audio>
</div>
<script>
$(document).ready(function() {
$('#audio-player').mediaelementplayer({
alwaysShowControls: true,
features: ['playpause','volume','progress'],
audioVolume: 'horizontal',
audioWidth: 300,
audioHeight: 120
});
});
</script>