안녕하세요 저는 Popup Maker라는 워드프레스 팝업 플러그인을 쓰고있는데
1.
휴대폰으로 www.haru.kr에 들어가서 자유게시판을 누르고 뒤로가기버튼을 누르면 팝업이 종료되는 것이 아닌 홈페이지의 히스토리 뒤로가기가 실행됩니다.
이 방법을 막고 팝업이 꺼지도록 하는 방법은 없을까요? 도와주시면 정말 감사하겠습니다 ㅠㅠ..
이방법을 해결할 수 없다면 팝업 말고 이러한 디자인으로 만들 수 있고 뒤로가기도 적용되는 방법이 있다면 알려주시면 감사하겠습니다.(제가 웹에 많이 약해서 죄송합니다..)
2.
데스크탑으로 www.haru.kr에 들어가서 배달 번호를 누르면 팝업은 정상적으로 뜨나 팝업 뒤 홈페이지가 최상단으로 움직이게 됩니다.
확인결과 아래 코드의 position: fixed;에서 발생하는것이었는데요, 이걸 지우면 아이폰에서 팝업창과 홈페이지 화면이 동시 스크롤되는 현상이 있고
이걸 fixed로 주면 홈페이지 최상단으로 위치가 fixed됩니다.
저는 현재 위치에 fixed가 되도록 하고 싶은데 어떻게 해야할지 도와주시면 정말 감사하겠습니다..
// 안드로이드 / 아이폰 팝업 스크롤 방지
html.pum-open.pum-open-overlay, html.pum-open.pum-open-overlay.pum-open-fixed .pum-overlay {
overflow: hidden!important;
}
html.pum-open.pum-open-overlay, html.pum-open.pum-open-overlay.pum-open-fixed .pum-overlay {
overflow: hidden;
position: fixed;
width: 100%;
}
html.pum-open.pum-open-overlay.pum-open-scrollable .pum-overlay.pum-active {
overflow-y: scroll;
-webkit-overflow-scrolling: touch;
}
(스레드봇님 항상 도움 많이 받고 있습니다! 감사합니다 :) )
안녕하세요.
휴대폰에서 뒤로가기버튼을 누르면 히스토리의 뒤로 가는 게 맞습니다.
PC에서도 동일하고요.
팝업이 닫히게 하려면 좀 더 복잡한 방법을 사용해야 합니다.
글로 설명하기도 좀 어렵군요.
간단히 설명해보겠습니다.
http://www.haru.kr/ 이렇게 홈페이지에 접속해서
현재는 자유게시판 버튼을 누르면 팝업이 뜨겠지요. 이 부분을 바꿔야 합니다.
자유게시판 버튼을 누르면 팝업이 뜨는게 아니라
페이지 주소를 바꿔주세요.
http://www.haru.kr/#free-board 이런 형식으로요.
주소의 해시가 바뀜으로서 해시에 따라서 팝업이 뜨게 해주시면 됩니다.
그럼 뒤로가기 하거나 http://www.haru.kr/# 이렇게 해시가 없다면 모든 팝업을 닫아주시면 되겠습니다.
즉, 해시가 바뀌는것을 감지해서 팝업을 열거나 닫아주시면 뒤로가기를 했을 경우 팝업을 닫을 수 있습니다.
어떻게 해시가 바뀌는것을 감지하는지?
그것은 hashchange 이벤트를 사용하시면 됩니다.
hashchange 관련해서는 관련 자료를 링크해드립니다.
http://html5ref.clearboth.org/doku.php?id=html5:event:onhashchange
http://writingdeveloper.tistory.com/219
두 번째는
정확히는 모르겠지만 position: fixed; 속성과는 크게 관련이 없어 보이네요.
팝업창이 뜨면 팝업창 뒤 원래 화면에서 y 스크롤이 없어지는 걸 확인할 수 있습니다.
팝업창이 사라지면 다시 y 스크롤이 생기고요.
즉, 페이지 맨 위로 가는 건 스크롤이 없어져서 위로 가게 되는 것 같습니다.
스크롤이 그대로 남아있도록 뭔가 해주셔야 할 듯합니다.
힘든 작업 하시는 듯합니다.
팝업 말고 따로 페이지를 두시는게 훨씬 쉬울거라 생각됩니다.
잘 해결되시길 바랍니다 ㅎㅎ