Question

我在我的网站上嵌入来自youtube频道的最新视频。但是，当显示时，视频的缩略图非常模糊/ sd。反正我是否可以强制使用缩略图？现场演示可用here。此外，当我点击最新按钮后按下浏览器上的返回时，缩略图的质量就变成了应有的样子。这是jQuery：

$(document).ready(function()
{
    $('#watch').on('click', function () {
    $(".iframe-container").show(300, function() 
    {
        $(".iframe-container iframe").css('opacity', 1);
        $(".info").css('opacity', 0);
        $("#watch").css('opacity', 0);
        $(".info").css('z-index', 1);
        $("#watch").css('z-index', 1);
        $("video#bg-vid").css('opacity', 0);   
    });
    $("#return").show("fast", function() {  $("#return").css('opacity', 1);});
});


  $('#return').on('click', function () 
  {
    $(".iframe-container").fadeOut("fast",function() 
    {
        $(".iframe-container iframe").attr('style', '');
        $(".info").attr('style', '');
        $("#watch").attr('style', '');
        $("#return").attr('style', '');
        $("video#bg-vid").attr('style', '');
        $('iframe').attr('src', $('iframe').attr('src'));  //stops video
    }); 
  });
});

iframe的css：

.iframe-container
{
    z-index: 1;
    display: none;
    position: absolute;
    background-color: transparent;
    top:160px;
    width:55%;
    height: 55%;
    color:white;
    font-size: 40px;
    left:0; 
    right:0; 
    margin:auto;

}
.iframe-container iframe
{
    width:100%;
    height: 100%;
    opacity: 0;
    -webkit-transition: opacity 0.3s ease-out;
    -moz-transition:    opacity 0.3s ease-out;
    -o-transition:      opacity 0.3s ease-out;
    -ms-transition:     opacity 0.3s ease-out;
}

感谢任何帮助，谢谢。

Answer 1

我发现问题主要发生在Firefox上，视频ID之后帮助我使用？autoplay = 1的原因是什么。 src =“ www.youtube.com/embed/{video_id}?autoplay=1” 希望对您有帮助

嵌入式Youtube视频的缩略图很模糊

1 个答案: