</head>
<body>
<div id="background"></div>
+ <audio id="audioPlayer" class="player" onended="nextButtonClick()" oncanplaythrough="playLoadedMedia()">
+
+ <source id=audioSrc type="audio/mpeg">
+ </audio>
+
+ <video id="videoPlayer" onClick="playButtonClick()" class="player">
+ <source id=videoSrc>
+ </video>
+
+ <div id="imagePlayer" onClick="nextButtonClick()" class="player"></div>
+
+ <div id="mediaList">
+ <ul id=mediaListItems>
+ </ul>
+ </div>
+
<div id="mainMenuButtons">
<img id="mainMusicButton" class="mainButton" src="images/musicButton.png" onClick="changeMenu(this.id)">
<img id="mainVideoButton" class="mainButton" src="images/videoButton.png" onClick="changeMenu(this.id)">
<canvas id="mediaName" style="position:absolute; z-index : 0"></canvas>
-
-
- <audio id="audioPlayer" class="player" onended="nextButtonClick()" oncanplaythrough="playLoadedMedia()">
-
- <source id=audioSrc type="audio/mpeg">
- </audio>
-
- <video id="videoPlayer" onClick="playButtonClick()" class="player">
- <source id=videoSrc>
- </video>
-
- <div id="imagePlayer" onClick="nextButtonClick()" class="player"></div>
-
- <div id="mediaList">
- <ul id=mediaListItems>
- </ul>
- </div>
-
</body>
</html>
}
}
});
+
+ document.getElementById('videoPlayer').addEventListener("playing", function() {
+ $("#navigationButtons").hide();
+ }, false);
+ document.getElementById('videoPlayer').addEventListener("pause", function() {
+ $("#navigationButtons").show();
+ }, false);
}
$(document).ready(function () {