질문글이 하나 올라와서 코드를 한번 짜 보았습니다. - https://sir.kr/qa/494755
유튜브원본 - https://www.youtube.com/watch?v=27R3EyTW_MY
[code]
<style>
#yt90Div { width:100%; position:relative; margin:0 auto; }
#yt90Div iframe { position:absolute; display:block; border:none; transform:rotate(90deg); }
</style>
<div id="yt90Div">
<iframe src="https://www.youtube.com/embed?playlist=27R3EyTW_MY&loop=1&autoplay=1&vq=highres" allow=autoplay allowfullscreen></iframe>
</div>
<script>
addEventListener("resize", yt90Size = () => {
yt90 = yt90Div.querySelector("iframe");
yt90Width = yt90Div.offsetWidth;
yt90Div.style.height = yt90.style.width = (yt90Width * 16 / 9) + "px";
yt90.style.height = yt90Width + "px";
yt90.style.top = yt90Width * 7 / 18 + "px";
yt90.style.left = yt90Width * -7 / 18 + "px";
} );
yt90Size();
</script>
[/code]
검은 뻘여백은 당연히 보이지 않습니다.^^
게시글 목록
| 번호 | 제목 |
|---|---|
| 18200 | |
| 18195 | |
| 18193 | |
| 18181 | |
| 18179 | |
| 18173 | |
| 18170 | |
| 18164 | |
| 18158 | |
| 18155 | |
| 18152 |
JavaScript
한글과컴퓨터 키워드추출스크립트.
2
|
| 18151 | |
| 18150 |
JavaScript
위에서 아래로 내려오는 효과 6가지
|
| 18140 | |
| 18139 | |
| 18138 |
JavaScript
마우스로 td 간격 조정하기.
1
|
| 18131 | |
| 18130 |
JavaScript
엘레먼트에 다이렉트로 변수,배열,객체 심기
|
| 18120 | |
| 18119 | |
| 18118 |
jQuery
0원팁- 숫자형 아이디에 접근하기
1
|
| 18117 |
jQuery
유용하게 써먹는 반응형 grid
1
|
| 18116 | |
| 18111 |
MySQL
db에서 트리거 만들기
|
| 18110 | |
| 18108 |
JavaScript
디바운스 debounce의 개념
1
|
| 18107 |
JavaScript
jquery 타이머 만들기
2
|
| 18106 | |
| 18100 | |
| 18090 |
댓글 작성
댓글을 작성하시려면 로그인이 필요합니다.
로그인하기