添加了隐藏元素，但现在我的悬停效果不再起作用
添加了隐藏元素，但现在我的悬停效果不再起作用
提问于 2021-01-12 20:44:20
我的javascript代码有一个问题，我为播放视频的文本制作了一个悬停效果。但现在我想在你不悬停文本时隐藏视频。当我添加隐藏元素时，悬停效果不再起作用...
你们知道解决方案吗？
<script type="text/javascript">
var Htext=document.getElementById("Htext");
var Hvideo=document.getElementById("Hvideo");
function PauseH(){
Hvideo.pause();
}
function PlayH(){
if(Hvideo.paused)
Hvideo.play();
}
if(Hvideo.pause){
Hvideo.hidden = true;
}else{
Hvideo.hidden = false;
}
</script>
<div>
<video id="Hvideo" width="320" height="240" preload="auto">
<source src="URL will be added" type="video/mp4">
</video>
<button id="Htext" onmouseover="PlayH()" onmouseout="PauseH()">HVAC</button>
</div>回答 1
Stack Overflow用户
回答已采纳
发布于 2021-01-12 23:11:14
您的代码看起来基本上是在工作：
https://www.w3schools.com/code/tryit.asp?filename=GMLBBYWJV4I2
<div>
<button id="Htext" onmouseover="PlayH()" onmouseout="PauseH()">HVAC</button>
</div>
<video id="Hvideo" width="320" height="240" controls>
<source src="https://www.w3schools.com/jsref/movie.mp4" type="video/mp4">
<source src="https://www.w3schools.com/jsref/movie.ogg" type="video/ogg">
Your browser does not support the video tag.
</video>
<script>
var Htext=document.getElementById("Htext");
var Hvideo=document.getElementById("Hvideo");
function PauseH(){
Hvideo.pause();
Hvideo.hidden = true;
}
function PlayH(){
if(Hvideo.paused) {
Hvideo.play();
Hvideo.hidden = false;
}
}
</script>我想知道这个问题是不是因为在运行JavaScript之前需要存在HTML元素，如果JavaScript在元素出现在页面上之前就运行了，那么它将失败。
页面原文内容由Stack Overflow提供。腾讯云小微IT领域专用引擎提供翻译支持
原文链接：
https://stackoverflow.com/questions/65684233
复制相关文章
相似问题
腾讯云开发者
