테스트 사이트 - 개발 중인 베타 버전입니다

유튜브 반응형 만들기

적용 스킨의 view.php상단에 넣어주시면 됩니다.

 

적응형 홈페이지에서 유튜브 반응형으로

<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>

 

반응형 홈페이지에서 유튜브 반응형으로

<script>

onresize = function() {

    for (yt of bo_v_con.getElementsByTagName("iframe")) {

        yt.style.width = "100%";

        yt.style.height = yt.offsetWidth * 9 / 16 + "px";

    }

}

onresize();

</script>

 

pc에서나 모바일에서 화면에 꽉차게 유튜브 영상이 출력됩니다.

유튜브 영상을 <iframe으로 공유했을때 적용됩니다.

댓글 작성

댓글을 작성하시려면 로그인이 필요합니다.

로그인하기

댓글 13개

감사 합니다.

@들레아빠 도움이 되셨기를 바랍니다^^

사실 아이프레임에

style="displsy:block;width:100%;aspect-ratio:16:9"

를 주면 모두 해결이 됩니다.

어쨌거나 왕수고 하셨습니다.

@비타주리 아 그렇군요! 아직 부족합니다.;;

@비타주리 와오 감사합니다

@swot74 도움이 되셨길 바랍니다.^^

@너나잘해 도움이 되셨기를^^

 

안녕하세요
view.php은 어디폴더에 들어있나요?

초보라 미안합니다.ㅜㅜ

잘 사용할게요^^

@초록물고기 그누보드 디렉토리에서 skin폴더에서 board 안에 basic이나 적용한 게시판스킨 안에 있습니다. 테마에서 게시판을 적용했을때는 theme안에 skin에 board안에 basic이나 적용한 보드스킨에 있습니다. 

@GREENnBLUE 답변 너무 감사합니다.

복받으세요^^

@초록물고기 네 도움이 되셨기를..^^

게시글 목록

번호 제목
23254
23244
23241
23236
23200
23199
23179
23174
23138
23128
23125
23116
23109
23099
23092
23083
23079
23063
23050
23036
23029
23007
23003
22983
22959
22943
22939
22934
22905
22897