work around browser playback restrictions
This commit is contained in:
parent
57a0c3a032
commit
b9c464b7a1
|
@ -9,7 +9,7 @@
|
|||
<title>CAMP</title>
|
||||
{% endblock %}
|
||||
<link rel="stylesheet" type="text/css" href="//fonts.googleapis.com/css?family=Open+Sans"/>
|
||||
<link rel="stylesheet" type="text/css" href="{% static "css/foundation.css" %}">
|
||||
<link rel="stylesheet" type="text/css" href="{% static "css/foundation.css" %}?20250201">
|
||||
<link rel="stylesheet" type="text/css" href="{% static "css/jquery.bxslider.css" %}">
|
||||
<link rel="stylesheet" type="text/css" href="{% static "css/main.css" %}">
|
||||
<link rel="stylesheet" type="text/css" href="{% static "css/app.css" %}">
|
||||
|
@ -117,6 +117,42 @@
|
|||
});
|
||||
}
|
||||
$(document).ready(loadSlideshow);
|
||||
var restrictedElements = [];
|
||||
function removeBehaviorsRestrictions(event) {
|
||||
if (restrictedElements.length > 0) {
|
||||
var rElements = restrictedElements;
|
||||
restrictedElements = [];
|
||||
rElements.forEach(function(video) {
|
||||
if (video.autoplay && video.paused) {
|
||||
video.load()
|
||||
video.play()
|
||||
if (video.paused) {
|
||||
restrictedElements.push(video)
|
||||
}
|
||||
} else if (video.readyState < 4) {
|
||||
video.load()
|
||||
}
|
||||
});
|
||||
}
|
||||
}
|
||||
|
||||
if (document.querySelector('video')) {
|
||||
let video = document.createElement('video');
|
||||
video.muted = true
|
||||
video.play();
|
||||
if (video.paused) {
|
||||
restrictedElements = document.querySelectorAll('video.gif')
|
||||
window.addEventListener('keydown', removeBehaviorsRestrictions);
|
||||
window.addEventListener('mousedown', removeBehaviorsRestrictions);
|
||||
window.addEventListener('touchstart', removeBehaviorsRestrictions);
|
||||
restrictedElements.forEach(video => {
|
||||
if (!video.poster) {
|
||||
video.poster = video.src.replace('.mp4', '.jpg')
|
||||
video.muted = true
|
||||
}
|
||||
})
|
||||
}
|
||||
}
|
||||
</script>
|
||||
{% block end %}
|
||||
{% endblock %}
|
||||
|
|
Loading…
Reference in New Issue
Block a user