[Javascript] 유튜브영상 반응형 삽입 방법
@욕심쟁이
·2020. 2. 14. 11:08
반응형
- HTML
<div class="video">
<iframe width="640" height="394" src="https://www.youtube.com/embed/주소?rel=0" frameborder="0" allow="accelerometer; autoplay; encrypted-media; gyroscope; picture-in-picture"></iframe>
</div>
- 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");
}
});
}
반응형
'IT > JavaScript' 카테고리의 다른 글
[JS] 변수 선언 (0) | 2020.07.20 |
---|---|
[Jquery] Image Map 반응형 시 좌표 잡는 JS라이브러리::RWD Image Maps (0) | 2020.03.06 |
[Jquery] 기능 이벤트 reset코드 (0) | 2020.01.08 |
::스크롤시 애니메이션효과 라이브러리::AOS. js (0) | 2020.01.06 |
[javascript] a태그 선택시 특정위치로 부드럽게 가기 (0) | 2019.12.11 |