Created
February 19, 2018 12:49
-
-
Save asathoor/8706b6a573ac7c3d0bb1cdd72ae8cf03 to your computer and use it in GitHub Desktop.
Sara: problem med videoplayer
This file contains bidirectional Unicode text that may be interpreted or compiled differently than what appears below. To review, open the file in an editor that reveals hidden Unicode characters.
Learn more about bidirectional Unicode characters
/* | |
Javacsript til Amazing Philippines | |
Webdokumentar 2018 | |
*/ | |
var audioGalleri = [ | |
"beach.mp3" | |
] ; | |
visAudio(audioGalleri[0]); | |
function visAudio( audio ) { | |
document.write( | |
'<main>' | |
+ '<audio autoplay loop>' | |
+ '<source src="audio/' | |
+ audio | |
+ '" type="audio/mpeg">' | |
+ '</audio>' | |
+ '</main>' | |
) | |
} | |
//Læs mere her knappen til cirklerne | |
function on(id) { | |
var knap = document.getElementById("knap" + id); | |
document.getElementById("overlay" + id).style.display = "block"; | |
knap.style.zIndex = 1; | |
knap.innerHTML = "Luk her"; | |
knap.setAttribute('onclick', 'off('+ id +')'); | |
} | |
function off(id) { | |
document.getElementById("overlay" + id).style.display = "none"; | |
var knap = document.getElementById("knap" + id); | |
knap.style.zIndex = 2; | |
knap.innerHTML = "Læs mere her"; | |
knap.setAttribute('onclick', 'on('+ id +')'); | |
} | |
/** | |
* scroll: test om element er synligt, og gør noget ved videoen ... | |
**/ | |
// varibale | |
var minVideo = document.getElementById("vid1"); // tag som indeholder videoen | |
var video = document.getElementById("endelige5"); // mp4 filen | |
// scoll | |
window.addEventListener("scroll", function(){ | |
if (elFllVsbl ( minVideo )){ | |
if (!(minVideo.curentTime > 0)){ | |
console.log("TRUE, så start video her ..."); | |
video.play(); | |
} | |
} else { | |
console.log("FALSE, sæt video på pause her ...") | |
// tjek selv hvordan man sætter videoen på pause ... ;-) | |
} | |
} | |
) | |
function elFllVsbl(el){ | |
return ( el.getBoundingClientRect().top>=0 && el.getBoundingClientRect().bottom<window.innerHeight); | |
} |
Sign up for free
to join this conversation on GitHub.
Already have an account?
Sign in to comment