코스모스팜 스레드
모바일 로딩시 작은 화면 숨기는 방법을 알려주세요~
안녕하세요? 그동안 KBOARD 관련 게시판에서 문의를 드렸었는데요.....
오늘은 다른 주제라서 이 쪽 게시판에 글을 올립니다.
다름이 아니라 워드프레스로 제작한 사이트인데, 모바일에서 접속하면
전체화면 사이즈로 폴 로딩이 되기 전에 썸네일 형태의 이미지(전체 페이지화면을 작게 축소한 모양)를
잠시 화면 좌측에 보여주었다가 0.5~1초후에 전체 화면이 로딩됩니다.
로딩 용량에 비해서 통신속도가 뒷 받침되지 못해서 생기는 문제인 것 같은데요...
중간에 잠시 깜박하고 나오는 이화면을 안보이게 하려면 어떻게 해야 하나요?
여기다 글을 올려도 답변을 주실지 궁금합니다.^^;;;
참고로 사이트는 http://remarketshop.co.kr 입니다.
-
스레드봇 (31060 Point)ㆍ2013.09.24 11:57
홈페이지를 모바일과 확인해보니 말씀하신 현상이 있네요
일반적인 반응형 CSS나 메타태그는 정상적으로 입력된듯합니다.
ie7-8등의 구버전은 반응형웹이 동작하지 않는게 일반적인데요, 모두 적용된걸 보니 스크립트가 추가로 적용된듯 합니다.
이 스크립트의 반응속도가 약간의 딜레이가 있는듯 하고요.
정확한 원인은 테마 제작자가 알듯싶네요^^
-
아담슨 (330 Point)ㆍ2013.09.24 12:17
이쪽 게시판도 답변을 빨리 해주시네요^^ 감사합니다.
오늘은 아침부터 이문제로 이곳 저곳을 찾아헤메는데, 워드프레스 카페에서 아래와 같은 답변을 받았습니다.
(답변 받은 내용)
간단하게 <body style="display:none;"> 그 다음 제이쿼리로
$(window).load(function(){
$('body').show()
});이런식으로 해주면 되지 않을까요?.... ^^;;
답변내용은 모든 파일이 로딩될 때까지 화면을 감추었다가, 파일 로딩이 끝나면 보여지게 하는 방법입니다.그런데 제 워드프레스 header.php 파일을 보면 <body> 태그 부분이 아래와 같이 시작됩니다.
<body <?php body_class(); ?>>
<header>
<div class="width-container">
....... (하략) .....
그래서 JQuery 를 잘몰라서 아래와 같이 고쳐서 사이트에 접속했더니... pc와 모바일 둘다 아무것도 안나오고흰색 화면만 나옵니다.
(제가 수정한 내용)
<body style="display:none;" <?php body_class(); ?>>
$(window).load(function(){
$('body').show() });
<header>
<div class="width-container">제이쿼리에 해결방법이 있을 것 같은데, 저와 같은 상태 (위의 body태그 참조)에서
어떻게 가능한 방법이 없을까요? 도와주시면 고맙겠습니다^^;;;
p.s 10월달에는 반드시 시간내서 JQuery 부터 배워야 겠네요^^*
바쁘시더라도 추가 도움을 주시면 참으로 고맙겠습니다. -
스레드봇 (31060 Point)ㆍ2013.09.24 12:22
jQuery(자바스크립트) 사용법이 잘못 되셨네요.
<body style="display:none;" <?php body_class(); ?>>
이렇게 해보시고요
아래 코드는 footer 쪽의 </body> 태그 바로 위에 넣어 보시겠어요?
<script>
$(window).load(function(){
$('body').show()
});
</script>
</body>직접 테스트해본게 아니기 때문에 해보시고 알려주세요~
-
아담슨 (330 Point)ㆍ2013.09.24 13:34
스레봇님 안녕하세요^^
(1) header.php 파일에는 아래의 코드대로 넣었고요...
<body style="display:none;" <?php body_class(); ?>>
(2) footer.php 파일에서 </body> 태그 바로 위에 말씀하신대로 아래와 같이 넣었습니다.
<script>
$(window).load(function(){
$('body').show()
});
</script>
</body>(3) 그런데 사이트에 접속하면 '흰색 화면만 나오네요'
그래도 어드민으로 접속이 가능해서 일단은 원상복귀를 했습니다.
저 기능만 되면 참 좋겠는데요. 아쉽네요^^;;;
스레봇님에게 계속 도와달라고 하기도 미안스럽고 ㅠ.ㅠ
-
스레드봇 (31060 Point)ㆍ2013.09.24 19:13
$(window).load(function(){
$('body').show()
});부분을
jQuery(document).ready(function(){
jQuery('body').show();
});이걸로 바꿔보시겠어요?
-
아담슨 (330 Point)ㆍ2013.09.24 19:59
스레드봇님!
(1) header.php 파일에는 먼저번 코드대로 넣었고요...
<body style="display:none;" <?php body_class(); ?>>
(2) footer.php 파일에서 </body> 태그 바로 위에 말씀하신대로 아래와 같이 넣었습니다.
<script>
jQuery(document).ready(function(){
jQuery('body').show();
});</script>
</body>(3) 결과는 마찬가지네요 ㅠ.ㅠ
이 것과는 무관하게 제가 10월달에 찾아뵙고 밥한번 사겠습니다^^*
-
스레드봇 (31060 Point)ㆍ2013.09.24 20:07
이상하네요~ 혹시 jQuery가 동작하지 않는건지도요...
<head>
.... 내용 ......
<script src="https://ajax.googleapis.com/ajax/libs/jquery/1/jquery.min.js"></script>
</head>위 처럼 head 태그 사이에(위치는 상관 없습니다) jQuery 추가후 다시 해보시겠어요?
-
아담슨 (330 Point)ㆍ2013.09.25 03:40
스레봇님! 도와주셔서 고맙습니다.
그런데 제가 Layerslider 플러그인을 사용하고 있는데요, 이것과 충돌이 있는 것 같습니다.
그리고 결과는 마찬가지인데요
(1) 메뉴가 pc에서 - 서브메뉴가 1줄로 나오던 것이 2줄로 나오고
(2) 모바일에서는 - 상단의 메인 메뉴바가 없어지는 현상이 일어납니다.
아마 제가 설치한 복잡한 환경과 관련이 있는 것 같아서 해결에 많은 시간이 걸릴듯하여 이것으로 종료를 해야 겠습니다.
나중에 바쁜일이 끝나면, 정식으로 기술지원을 요청받도록 하겠습니다.
그런데 정식으로 기술요청을 받으면 비용은 얼마나 되는지 궁금합니다^^*
ps. 본건은 세팅환경의 복잡성으로 인해서, 잠정 종료하도록 하겠습니다^^*
여러모로 많이 도와주셔서 감사합니다!!!
