[ Tistory ] 제이쿼리와 CSS를 이용한 반응형 유튜브 플레이어
블로그를 손보다 반응형에 맞추어 동영상 플레이어도 크기를 조절하는 방법을 찾다 생각한 방법입니다. 기존 CSS 방식의 문제점 널리 알려진 CSS만을 이용한 동영상 플레이어를 반응형으로 만들거나 Bootstrap의 Responsive embed를 이용할 때에는 동영상의 원래의 크기와 상관없이 가로길이가 100%에 맞춰지게 됩니다. 이는 본문 크기보다 큰 동영상의 경우는 관계없지만, 본문보다 작은 동영상의 경우 오히려 보기가 불편해집니다. 여기서 소개하는 방법은 동영상보다 본문의 크기가 클 때는 동영상의 사이즈로 크기가 조절되고 동영상보다 본문이 작아지면 본문의 100% 맞춰지는 방법입니다. 그리고 동영상의 비율도 함께 조절됩니다. 이제부터 적용하는 방법에 대하여 설명하겠습니다. 먼저 동영상의 원래 크기부터..