HTML YouTube плеер iframe размыт, но само видео в порядке - PullRequest
Новая
       59

HTML YouTube плеер iframe размыт, но само видео в порядке

0 голосов
/ 20 октября 2018

Я добавляю iframe к телу моего html, используя jquery в качестве всплывающего окна и стилизую его в CSS как фиксированный элемент в центре экрана.Все хорошо, и само видеоизображение не имеет проблем с качеством, но кнопки и заголовок в iframe странно размыты.

Here's the odd blur

Вот JS, который вводит его: 

$(".item").click(function() {
    $("#filterHost").addClass("popFilter");
    $("body").append("<iframe class=\"popVideoPlay\" src=\"https://www.youtube-nocookie.com/embed/VEOJcZk8R5U/&vq=hd1080\"  allow=\"autoplay; encrypted-media\" allowfullscreen></iframe>");
})

А вот CSS, который его стилизует 

.popVideoPlay {
width: 70vw;
height: calc(70vw/1.66666);
position: fixed;
top: 50%;
left: 50%;
transform: translate(-50%, -50%);
-ms-transform: translate(-50%, -50%);
-moz-transform: translate(-50%, -50%);
-webkit-transform: translate(-50%, -50%);
z-index: 10;

}

Буду признателен за любую помощь

...