반응형에서 모니터 사이즈에 따라 js 파일을 다르게 불러들일수도 있나요?
본문
pc에서 필요한 특정 js 파일때문에 모바일에서 햄버거메뉴(슬라이드 메뉴)가 열리질 않는데요.
js를 볼줄을 몰라서 수정이 어렵고 js파일 자체를 구분해서 불러올 방법이 없는지 찾는중인데 혹시 그런게 가능한가요?
pc에선 a.js를 불러들이고 특정사이즈 이하 화면에선 b.js를 불러들이는 방법이 있는지 궁금합니다
답변 2
그누보드의 G5_IS_MOBILE 상수를 활용할 수 있습니다.
<?php if (G5_IS_MOBILE) { ?>
<script src="mobile.js"></script>
<?php } else { ?>
<script src="pc.js"></script>
<?php } ?>
다만 위 코드는 화면 너비 기준이 아닌.. 접속 기기 기준입니다.
화면 너비에 따른 스크립트 로드는 다음의 글을 참고해 볼 수 있습니다.
https://stackoverflow.com/a/4811342
https://stackoverflow.com/a/23438659
그누가 아니고 일반 html인데 어떻게 해야할지요ㅠ
샘플용이라 그누를 깔기전에 작업물 보여주는 용도거든요.ㅠㅠ
https://stackoverflow.com/a/4811342
https://stackoverflow.com/a/23438659
참고요.
jquery 기반이라 jquery 가 로드되어야 합니다.
<script src="https://ajax.googleapis.com/ajax/libs/jquery/3.4.1/jquery.min.js"></script>
<script>
var scriptSrc = 'js/defaults.js';
if (screen.width <= 800)
scriptSrc = 'js/defaults-800.js';
else if (screen.width <= 1024)
scriptSrc = 'js/defaults-1024.js';
var script = document.createElement('script');
script.src = scriptSrc;
var head = document.getElementsByTagName('head')[0];
head.appendChild(script);
</script>
알려주셔서 감사드립니다.^^
