After clicking the thumbnail, the youtube video is not opening. It leaves white blank, have to reload to see the main video
$(function () {
var videos=$(".video");
videos.on("click", function () {
var elm=$(this), conts=elm.contents(), le=conts.length, ifr=null;
for (var i=0;
i < le;
i++) {
if (conts[i].nodeType==8) ifr=conts[i].textContent;
}
elm.addClass("player").html(ifr);
elm.off("click");
}
);
}
)<div class="video">
<img class="zoom-video" src="~/image/body/special-offer.png">
<iframe width="600" src="https://www.youtube.com/embed/Ze7xsy9tVVQ" frameborder="0" allowfullscreen></iframe>
</div>Try to copy the provided iframe from the video. Go to the video, click share, then click embed.
Copy paste the code there and try to run the code again.
Here's an example:
<iframe width="560" height="315" src="https://www.youtube.com/embed/dQw4w9WgXcQ" title="YouTube video player" frameborder="0" allow="accelerometer; autoplay; clipboard-write; encrypted-media; gyroscope; picture-in-picture" allowfullscreen></iframe>