这里我嵌入了我的代码。其实我想用弹出的方式播放视频,同时用java脚本点击html中的按钮。此代码正在工作,但视频仍在后台播放。如何在点击HTML中的按钮时弹出视频
function myFunction() {
var popup = document.getElementById("myPopup");
popup.classList.toggle("show");
popup.play(true)
}
.popup .popuptext {
visibility: hidden;
background-color: #555;
color: #fff;
text-align: center;
border-radius: 6px;
padding: 8px 0;
z-index: 1;
bottom: 125%;
left: 50%;
margin-left: -80px;
}
.popup .show {
visibility: visible;
-webkit-animation: fadeIn 1s;
animation: fadeIn 1s;
}
@-webkit-keyframes fadeIn {
from {
opacity: 0;
}
to {
opacity: 1;
}
}
@keyframes fadeIn {
from {
opacity: 0;
}
to {
opacity: 1;
}
}
<body style="text-align:center">
<div class="popup" onclick="myFunction()"><button>Preview</button>
<video class="popuptext" id="myPopup" style="width:800px;">
<source src="dolby-atmos-intro.mp4" type="video/mp4">
</video>
</div>
</body>
你的意思是从一开始播放视频点击按钮之前? –
你可以使用引导模式在这里..好教程http://www.tutorialrepublic.com/faq/how-to-embed-youtube-video-inside-bootstrap-modal.php和 – Jana
@Ridhik尝试引导模态弹出窗口。它非常优雅,需要更少的代码。 –