모바일 iframe 채택완료
초초동
4년 전
조회 2,101
모바일에서 iframe으로 youtube 를 넣으면
모바일에서 넘치는? 상황이 많아서
/* 제품 상세내에 유튜브 */
.youtube_video {margin-top:20px;position: relative;width: 100%;padding-bottom: 56.25%;}
.youtube_video iframe {position: absolute;width: 100%;height: 100%;left:0;top:0}
이렇게 해서
되기는 하는데...
제가 올릴때는 괜찮은데 고객들이
올릴경우에는
댓글을 작성하려면 로그인이 필요합니다.
답변 1개
4년 전
자문 자답
</p>
<pre>
$(document).ready(function() {
if(typeof YOUTUBE_VIDEO_MARGIN == 'undefined') {
YOUTUBE_VIDEO_MARGIN=5;
}
$('iframe').each(function(index,item) {
if($(item).attr('src').match(/(https?:)?\/\/www\.youtube\.com/)) {
var w=$(item).attr('width');
var h=$(item).attr('height');
var ar = h/w*100;
ar=ar.toFixed(2);
//Style iframe
$(item).css('position','absolute');
$(item).css('top','0');
$(item).css('left','0');
$(item).css('width','100%');
$(item).css('height','100%');
$(item).css('max-width',w+'px');
$(item).css('max-height', h+'px');
$(item).wrap('<div style="max-width:'+w+'px;margin:0 auto; padding:'+YOUTUBE_VIDEO_MARGIN+'px;" />');
$(item).wrap('<div style="position: relative;padding-bottom: '+ar+'%; height: 0; overflow: hidden;" />');
}
});
});</pre>
<p>
로그인 후 평가할 수 있습니다
댓글을 작성하려면 로그인이 필요합니다.
답변을 작성하려면 로그인이 필요합니다.
로그인