채택완료

iframe 모바일 버전 사이즈에 맞게..

<iframe width="800" height="600" src="https://calendar.google.com/calendar/embed?mode=WEEK&amp;height=600&amp;wkst=2&amp;bgcolor=%23ffffff&amp;src=ducdkgmck77m542r4bgvrvd8rg%40group.calendar.google.com&amp;color=%23711616&amp;ctz=Asia%2FSeoul" frameborder="0" scrolling="no" style="border-width: 0px;"></iframe>

 

이런식으로 iframe을 넣으니 모바일 버전에서는 사이즈가 줄어들지 않고

 

달력인데 수요일까지만 나오게 짤려서 나옵니다..

 

혹시 모바일 버전으로 iframe을 넣고 안 짤리게 나오려고 하면 width height 부분을 auto로 하면 되나요??

 

auto로 하니까 적용이 잘 안되는거 같더라고요... 반응형같이 사이즈에 따라서 변경 될 수 있도록

 

만들고 싶은데ㅜㅜ 도움 부탁드립니다...

|

답변 2개 / 댓글 6개

채택된 답변
+20 포인트

단순하게는 width:100%로 처리해보시고

안되면 css를 이용하셔서, 

.test { overflow: hidden; position: relative; padding-bottom: 56.25%; }

클래스를 지정해서 생성하여 <div class="test"> 아이프레임주소 </div>

이런식으로 해주셔도 되겠네요.

답변에 대한 댓글 3개

적용이 안되네요 ..ㅜㅜ

혹시 모바일로 들어갔을 때 너비랑 높이를 달리 설정하는 방법은 어떻게 해야될까요..??
if문을 이용해 is_mobile 같은 방식으로
아이프레임 태그 관련을 PC일때 모바일일때
다르게 감싸주셔서 사용해도 되겠네요.
if 문이 혹시 html 텍스트 안에 작성해도 적용될까요??

답변에 대한 댓글 3개

아무것도 안 뜨는...
음냐... gfycat 유튜브 등 아이프레임으러 감싼 영상이 모바일에서 짤려서 나오는데... 정보를 찾다가 여기에 도착했습니다. 이게 정답인것 같기는 한데... 전부 영어라... 댓글만 달거 갑니다. ㅠ.ㅠ

답변을 작성하려면 로그인이 필요합니다.