javascript - 删除特定宽度的 div/iframe

Question

我想让我的网站适合移动设备，但我遇到了一个问题。我的主页上有一个流媒体平台的播放器，通过在 CSS 中使用媒体查询，它在一定宽度上不可见/隐藏，但它仍然被加载。

我想完全删除宽度低于 1280 像素或 768 像素的容器/iframe。

我试着摆弄一下 jquery/javascript 但它对我不起作用，我需要一些帮助 :D

这是我尝试使用的:

$(window).resize(function() {
        if ($(window).width() < 1280) {
            $(container_selector).document.getElementById("video-container"){
                this.pause();
                delete(this);
                $(this).remove();
            });
            $(container_selector).empty();
        }
    });

这是我要删除的容器/iframe:

<div id="video-container"><iframe src="http://www.hitbox.tv/embed/kazuto" width="300" height="150" frameborder="0" allowfullscreen="allowfullscreen"></iframe></div>

提前致谢:)

Answer 1

您可以使用 media queries .

例如，像这样:

@media (max-width: 1280px) {
  #video-container {
    display: none;
  }
}