질문과 답변 (구)

최근본상품
TOP
DOWN

질문과 답변 (구)

모바일 사이드 메뉴 후 부모창 스크롤 막기

2015.07.14 17:22 14,103 4

본문

안녕하세요. 이번에 pc cummunity 테마 구매 후 적용 중입니다.

1. 모바일 화면에서 사이드 메뉴 팝업 후 팝업(사이드메뉴)만 스크롤 되고 뒤에 있는 부모창은 스크롤이 되지 않게 막고 싶은데

어느 부분에 소스를 수정 하면 될까요?

아래와 같은 코드를 추가 하려고 하는데 조언 부탁 드립니다.

==============================

// 터치 동작을 막을 부분에 추가 (레이어팝업 호출)
$('body').bind('touchmove', function(e){
    e.preventDefault()
});

// 터치 동작을 다시 해제시킨다. (레이어팝업 닫기)
$('body').unbind('touchmove');

==============================

2. pc 모드에서 웹진 게시판의 경우에도 팝업 후 부모창이 스크롤 되는데 막는 방법이 없을까요?

팝업 이벤트 방식이 i-frame으로 가지고 있다고 show/hide 형식으로 보여주는것 같은데 소스의 위치나 형식이 익숙치 않아

조금 헤메고 있네요.

eyoom/theme/pc_community/skin_pc/board/webzine/list.skin.html 에서 아래 함수 찾아보다 질문 올려 봅니다.

==============================

function eb_modal(href) {
    $('.view-iframe-modal').modal('show').on('hidden.bs.modal', function () {
        $("#view-iframe").attr("src", "");
    });

   debugger;

    $('.view-iframe-modal').modal('show').on('shown.bs.modal', function () {
        $("#view-iframe").attr("src", href);
        $('#view-iframe').height(parseInt($(window).height() * 0.7));
    });
    return false;
}

==============================

 

 

 

0
로그인 후 평가 가능합니다.
- 야관문광규 - 회원등급 : 지하계 / Level 1
포인트 630
경험치 39
[레벨 1] - 진행률 20%
- 가입일 : 2015-07-14 16:48:38
- 서명 : 차로도 좋도 술이 더 좋아
- 자기소개 : 미입력

댓글목록 4

shadow님의 댓글

shadow 2015.07.14 20:18

css를 이용하는 방법을 택하시면 될 듯 합니다.


.modal-open {
    overflow: hidden;
    position: fixed;
    width: 100%;
}

축하합니다. 첫댓글 포인트 99포인트를 획득하였습니다.

야관문광규님의 댓글

답변 감사합니다.

위의 내용으로 적용 했습니다.
추가로 해당 테마에 버그인 것 같은데 현재 무한 스크롤 사용시 팝업을 띄웠을 시 스크롤이 두개가 생성 됩니다.

style.css 파일에서  위의 내용을 추가하고

.modal-open .modal {overflow-x:hidden;overflow-y:auto} -> .modal-open .modal {overflow-x:hidden;overflow-y:none}

해당 내용을 변경 해야지 정상적으로 동작합니다.

해당 내용적용 후 브라우져에서 변경이 되지 않을 시 초기화 해야지 제대로 동작되는 지 확인이 됩니다.
css이 파일 캐쉬가 되어 있어서 바로 변경이 되지 않습니다.

shadow님의 댓글

shadow 2015.07.15 16:51

위 방법 외에 스크립트를 활용하는 방법도 있습니다.


$('.modal') 
.on('shown', function(){ 
  console.log('show'); 
  $('body').css({overflow: 'hidden'}); 
}) 
.on('hidden', function(){ 
  $('body').css({overflow: ''}); 
}); 

그런데 위에 css와 마찬가지로 적용을 해보면 backgroud body가 스크롤 적용은 안되지만 모달창을 띄우게 되면  backgroud body가 최상단으로 자동 이동되고 backgroud body가 전체화면으로 전환되더군요.
이건 좀 연구가 필요할 듯 합니다.

cygz님의 댓글

cygz 2015.12.02 07:21

감사합니다

질문과 답변 (채택기능) 게시판이 신설되었습니다.
질문과 답변 (구) 게시판은 글쓰기가 제한되오니 착오 없으시길 바랍니다. (댓글 및 조회는 여전히 가능합니다.)

전체 2,800 건 - 129 페이지
제목
미니스타92 2015.07.16 769 0
갓구운빵 2015.07.16 648 0
일루와 2015.07.16 799 0
red123 2015.07.15 1,029 0
서종득 2015.07.14 902 0
후아 2015.07.14 869 0
야관문광규 2015.07.14 14,104 0
일루와 2015.07.14 1,176 0
비즈팔 2015.07.14 942 0
톡톡톡 2015.07.13 829 0
끝없는사랑 2015.07.13 999 0
shadow 2015.07.13 1,191 0
프리피피티 2015.07.12 1,245 0
총사달타냥 2015.07.12 1,837 0
끝없는사랑 2015.07.11 1,119 0