有没有办法让标题显示在嵌入视频中的鼠标悬停上？
我在DIV中尝试了ALT和TITLE属性，但没有成功。
<!DOCTYPE html>
<html>
<body>
<DIV TITLE="TEST" ALT="Test">
<iframe width="420" height="345"
src="http://www.youtube.com/embed/XGSy3_Czz8k">
</iframe>
</DIV>
</body>
</html>
我找到了用于在悬停时播放视频的纯JS解决方案，但不确定如何在悬停时修改标题。
script>var playersrc;</script>
<iframe class="yt560x315" id="JSytplayer" src="https://www.youtube.com/embed/MVKts0fBW34?rel=0" onmouseover="this.src=playersrc+'&autoplay=1'" onmouseout="this.src=playersrc" frameborder="0" allowfullscreen></iframe>
<script>playersrc=document.getElementById('JSytplayer').src;</script>
最佳答案
当光标悬停在视频上时，您的iframe广告代码将处于优先级，而iframes不接受“title”属性，因此它将永远不会出现。
我认为，显示div标题的唯一方法是在div中添加填充，但是仅当您将鼠标悬停在填充区域而不是将iframe悬停时才会显示。
但是，我会通过jQuery完成
您的HTML代码:
<!DOCTYPE html>
<html>
<body>
<DIV id="wrapper">
<div id="tooltip" style="display:none;">Title</div>
<iframe width="420" height="345" src="http://www.youtube.com/embed/XGSy3_Czz8k">
</iframe>
</DIV>
</body>
</html>
您的jQuery代码:
$(document).ready(function(){
$("#wrapper").hover(function(){
// Show our tooltip on hover
$("#tooltip").show();
}, function(){
// Hide our tooltip
$("#tooltip").hide();
})
});
然后，您只需要添加一些CSS
关于javascript - 悬停在嵌入视频中的标题上，我们在Stack Overflow上找到一个类似的问题： https://stackoverflow.com/questions/35098202/