PC에서 읽을 소스와 모바일에서 읽을 소스를 구분하는 방법
본문
간단한 반응형 랜딩페이지 작업중에 부득이 iframe을 써야 하는 경우가 생겨서요.
PC에서는 iframe 이 사이즈에 맞게 잘 보이는데
모바일에서는 사이즈를 맞추기엔 무리가 있어서요.
해당 부분은 PC에서만 보이고, 모바일에서는 "해당 내용은 PC에서만 보실 수 있습니다." 로
나타내려고 합니다.
이럴 경우 소스를 어떻게 코딩하면 될까요?
참고로, PC용 소스는
<div class="Flexible-container">
<iframe src="페이지url" frameborder="0" allowfullscreen></iframe>
</div>
입니다.
PC에서만 위의 iframe 소스가 보이고, 모바일에서는 안내문구가 보이게 하고 싶습니다.
도움 부탁 드립니다.
답변 2
<div class="Flexible-container">
<?php if(!is_mobile()) { ?>
<iframe src="페이지url" frameborder="0" allowfullscreen></iframe>
<?php } else { ?>
"해당 내용은 PC에서만 보실 수 있습니다."
<?php } ?>
</div>
감사합니다. 지금 적용해봤는데요. G5에서는 잘 됩니다.
그런데 G5를 사용하지 않는 페이지의 경우 미디어태그를 통해서 적용한다면 어떻게 하면 될까요?
G5를 사용하지 않는 페이지라도 해당 서버에 그누보드가 설치되어 있다면
페이지 상단에 그누보드 루트에 있는 common.php 파일을 인클루드하면 사용할 수 있습니다.
미디어쿼리로 하려면 볼피드님이 알려주신대로 하면 되겠죠.
@media screen and (max-width:990px)
{
.mobile-none{display:none;}
}
이런식으로 미디어 쿼리 이용하시면 됩니다