使用jQuery更改iframe的宽度和高度？

Question

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

我试过这个:

<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中删除它.我正在使用Tumblr ..

Answer 1

如果您添加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(指数)选择,这将匹配的从零开始的索引.因此,如果页面上有两个iFrame,并且只想更改第二个,请使用:

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