14

我尝试了在这个网站上找到的解决方案。但是，它对我不起作用。我在想有一个脚本在其他地方设置这个，所以我需要在页面中添加一些代码来覆盖样式。

我试过这个：

<script type="text/javascript">
    $(document).ready(function () {
        $("#frame1").width(578);
        $("#frame1").height(326);
    });
</script>

但是，html 仍然是这样的：

<iframe frameborder="0" src="http://player.vimeo.com/video/20657168?color=fc030f" style="width: 500px; height: 281.25px;"></iframe>

我想width成为578和height成为326。这是网站：http ://beckindesigns.tumblr.com/

PS 如果我添加一个类或 ID，它会从 html 中删除它。我用的是豆瓣。。

4

2 回答 2

27

如果您添加id="frame1"到您的iframe.

<iframe frameborder="0" id="frame1" src="http://player.vimeo.com/video/20657168?color=fc030f" style="width: 500px; height: 281.25px;"></iframe>

将$("#frame1")选择具有 id 属性的元素frame1。供参考：jQuery 选择器和ID 选择器。

更新：由于您说 ID 被剥离，您可以更改选择器的工作方式，并将其应用于所有 iFrame：

<script type="text/javascript">
    $(document).ready(function () {
        $("iframe").width(678);
        $("iframe").height(526);
    });
</script>

如果页面上有多个 iFrame，并且不希望它们大小相同，则可以使用:eq(index)选择器，它将匹配从零开始的索引。因此，如果页面上有两个 iFrame，并且只想更改第二个，请使用：

<script type="text/javascript">
    $(document).ready(function () {
        $("iframe:eq(1)").width(678);
        $("iframe:eq(1)").height(526);
    });
</script>
于 2013-02-16T18:51:57.040 回答
1

将 iframe 调整为窗口大小

<iframe frameborder="0" src="http://player.vimeo.com/video/20657168?color=fc030f" style="width: 500px; height: 281.25px;"></iframe>

<script>
    $(document).ready(function(){
       $("iframe").height($(window).height());
       $("iframe").width($(window).width());

       $( window ).resize(function() {
            $("iframe").height($(window).height());
            $("iframe").width($(window).width());
        });
    });
  </script>
于 2018-06-25T18:56:12.103 回答