아이프레임 높이 자동조절

<script type="text/javascript">

// iframe resize

function autoResize(i)

{

    var iframeHeight=

    (i).contentWindow.document.body.scrollHeight;

    (i).height=iframeHeight+20;

}

</script>

문서의 <iframe> 코드에 포함되어야 할 스크립트.

 

<iframe src="#iframeUrl" onload="autoResize(this)" scrolling="no" frameborder="0"></iframe>

 

 

<div class="videoContainer" style="width:70%;margin:0 auto;">

        <iframe width="<?=$view[wr_9];?>" height="600" src="https://www.youtube.com/embed/<?=$view[wr_1]?>?rel=0<?=$autop?><?=$loopp?>" frameborder="0" allow="accelerometer; autoplay; encrypted-media; gyroscope; picture-in-picture" allowfullscreen></iframe>

        </div>

    

    <script type="text/javascript">

      $(window).resize(function(){resizeYoutube();});

      $(function(){resizeYoutube();});

      function resizeYoutube()

      {

            $("iframe").each(function(){

                   if( /^https?:\/\/www.youtube.com\/embed\//g.test($(this).attr("src")) )

                   {

                         $(this).css("width","100%");

                         $(this).css("height",Math.ceil( parseInt($(this).css("width")) * 480 / 854 ) + "px");

                   }

             });

       }

      </script>