[英]hide div and show iframe with countdown using javascript
When the page load this iframe class="frame_src"
must be hidden like, display="none"
当页面加载时,此iframe
class="frame_src"
必须像display="none"
这样隐藏
And after 10 seconds this div must hide class="load_video"
and show iframe class="frame_src"
在10秒钟后,该div必须隐藏
class="load_video"
并显示iframe class="frame_src"
Right now the problem is when countdown is counting somehow the iframe video plays in background, I can hear it, and when the 10 seconds elapsed, it will play the video again. 现在的问题是,当倒数计时到iframe视频以某种方式在后台播放时,我可以听到,而在10秒钟后,它将再次播放视频。
Here's my full code : http://plnkr.co/edit/LhxRjJXBnCGKGfW4ZLWO?p=preview 这是我的完整代码: http : //plnkr.co/edit/LhxRjJXBnCGKGfW4ZLWO?p=preview
Here's my javascript code : 这是我的JavaScript代码:
<script>
function startChecking() {
secondsleft -= 1e3, document.querySelector(".load_video").innerHTML = "Please Wait.. " + Math.abs(secondsleft / 1e3) + " Seconds", 0 == secondsleft && (clearInterval(interval), $(".reloadframe").show(), document.querySelector(".load_video").style.display = "none", document.querySelector(".frame_src").style.display = "", document.querySelector(".frame_src").src = document.querySelector(".frame_src").getAttribute("data-src"))
}
function startschedule() {
clearInterval(interval), secondsleft = threshold, document.querySelector(".load_video").innerHTML = "Please Wait.. " + Math.abs(secondsleft / 1e3) + " Seconds", interval = setInterval(function () {
startChecking()
}, 1e3)
}
function resetTimer() {
startschedule()
}
var timeout, interval, threshold = 1e4,
secondsleft = threshold;
window.onload = function () {
startschedule()
};
</script>
OK, you have to clear the content of the iframe
as well as it's src
. 好的,您必须清除
iframe
的内容以及src
。
You can use about:blank
for it's src
as it loads a bland page in the iframe
您可以使用
about:blank
作为src
因为它会在iframe
加载平淡的页面
so if you add 因此,如果您添加
document.querySelector(".frame_src").src = "about:blank";
to the beginning of the startschedule()
function, it will do the trick for you. 到
startschedule()
函数的开头,它将为您解决问题。
your function should look like this after the change: 更改后,您的函数应如下所示:
function startschedule() {
document.querySelector(".frame_src").src = "about:blank";
clearInterval(interval), secondsleft = threshold, document.querySelector(".load_video").innerHTML = "Please Wait.. " + Math.abs(secondsleft / 1e3) + " Seconds", interval = setInterval(function() {
startChecking()
}, 1e3)
}
声明:本站的技术帖子网页,遵循CC BY-SA 4.0协议,如果您需要转载,请注明本站网址或者原文地址。任何问题请咨询:yoyou2525@163.com.