可能是一个简单的解决方案。我想扩大一个嵌入式视频下面的“观看视频”,当它被点击。非常直接,但是我无法让这段代码在单击时将“扩展”类添加到video__player div中。任何帮助在这里是非常感谢,谢谢。
代码:
$(".video").click(function() {
$(".video__player").addClass("expanded");
});
.video__player {
display: none;
width: 80vw;
max-width: 560px;
max-height: 315px;
height: 0;
transition: 0.5s;
margin: auto;
}
iframe {
width: 100%;
height: 100%;
}
.expanded {
height: 45vw !important;
display: block;
}
<script src="https://ajax.googleapis.com/ajax/libs/jquery/2.1.1/jquery.min.js"></script>
<div class="video__container animated fadeInDownShort slow">
<a class="h6 video clickable">Watch the video <img class="play-btn" src=""></a>
</div>
<div class="video__player">
<br><br>
<iframe src="" frameborder="0" allowfullscreen></iframe>
</div>
1条答案
按热度按时间qij5mzcb1#
第一,正如注解所说,您可能没有将其 Package 在$(document).ready(function(){})中;处理程序。第二,您的allowFullScreen尚未设置值。未设置,默认值为false。如果你想让它全屏显示,请将其设置为true。通过JSFiddle或repl.it发布您的完整代码也会有所帮助,因为它可以是其他东西。
在stackoverflow解释器中,您的代码似乎工作正常。可能是你用的翻译器的问题?