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

유튜브 반응형 만들기

적용 스킨의 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 답변 너무 감사합니다.

복받으세요^^

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

게시글 목록

번호 제목
22349
22347
22312
22308
22303
22282
22269
22259
22253
22234
22221
22197
22191
22179
22151
22144
22135
22130
22118
22110
22098
22095
22076
22057
22053
22051
22050
22046
22044
22042