随机图片播放器代码修复与优化
<!DOCTYPE html>
<html lang="zh-CN">
<head>
<meta charset="utf-8">
<meta name="viewport" content="width=device-width,initial-scale=1">
<style>
#scrolldiv {
overflow: hidden;
}
</style>
</head>
<body>
<section id="main">
<img id="player" src="" controls="" webkit-playsinline="" playsinline="">
</section>
<section id="buttons">
<button id="next">下一位</button>
</section>
<script>
(function(window, document) {
if (top != self) {
window.top.location.replace(self.location.href);
}
var get = function(id) {
return document.getElementById(id);
}
var bind = function(element, event, callback) {
return element.addEventListener(event, callback);
}
var auto = true;
var player = get('player');
var randomm = function() {
player.src = 'http://sp.guodns.xyz/tp/sjmt.php?' + Math.random();
player.play();
}
randomm(); // 加载随机的第一张图片
bind(get('next'), 'click', randomm);
bind(player, 'error', function() {
randomm();
});
bind(get('switch'), 'click', function() {
auto = !auto;
this.innerText = '自动播放' + (auto ? '开' : '关');
});
bind(player, 'ended', function() {
if (auto) randomm();
});
})(window, document);
</script>
</body>
</html>
原文地址: https://www.cveoy.top/t/topic/nrKb 著作权归作者所有。请勿转载和采集!