web-dev-qa-db-fra.com

Changer la largeur et la hauteur d'iframe à l'aide de jQuery?

J'ai essayé une solution que j'ai trouvée sur ce site. Cependant, cela n'a pas fonctionné pour moi. Je pense qu'il y a un script qui définit cela ailleurs, donc je dois ajouter du code dans la page pour remplacer le style.

J'ai essayé ceci:

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

Cependant, le code HTML est toujours le suivant:

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

Je veux que la width soit 578 et que la height soit 326. Voici le site: http://beckindesigns.tumblr.com/

P.S. Si j'ajoute une classe ou un identifiant, il la supprime du html. J'utilise Tumblr ..

jquerycssiframe
11
user1717480

Cela fonctionnera si vous ajoutez id="frame1" à votre iframe.

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

$("#frame1") sélectionnera l'élément avec l'attribut id frame1. Pour référence: Sélecteurs jQuery et Sélecteur d’ID .

Mise à jour: Puisque vous avez dit que l'ID est supprimé, vous pouvez simplement changer le fonctionnement du sélecteur et l'appliquer à toutes les iFrames:

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

Si vous avez plusieurs iFrames sur la page et que vous ne voulez pas qu'ils aient la même taille, vous pouvez utiliser le sélecteur : eq (index) , qui correspondra à l'index de base zéro. Donc, si vous avez deux iFrames sur la page et que vous voulez seulement changer le second, utilisez:

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

Ajuster iframe à la taille de la fenêtre 

<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>
0
Raymundo Pizano González