2013-08-12 2 views
-5

jquery를 사용하여 사용자 정의 라이트 박스를 만들고 있는데 응답 성이 높은 사이트이므로 폼을 스크롤해야 할 때 어떻게해야하는지 궁금합니다. 일부 화면 크기에서는 양식이 폴드 아래로 늘어나지 만 페이지를 스크롤하면 그 사이트가 대신 스크롤됩니다. 스크롤 기능을위한 새로운 동적 콘텐트에 어떻게 집중합니까? 스크롤 가능한 동적 내용

www.evoke.me

은 약간 페이지를 아래로 스크롤 한 후 연락처 버튼을 클릭합니다.

다음은 내가 작업하고있는 코드입니다.

$('#contact').on('click', function(e){ 
     e.preventDefault(); 
     $('#modal').remove(); 
     $('body').append('<div id="modal"></div>'); 
     $("#modal").load('/forms/contact-form.html').hide().fadeIn(1000); 
}); 

#modal{ 
    position:absolute; 
    overflow:auto; 
    top:0; 
    z-index:5000; 
    width:100%; 
    height:100%; 
    background:rgba(255, 255, 255, .95) url(../images/diag-pattern.png) repeat 0 0; 
} 
+1

코드에서 정확히 어디에서 문제가 있습니까? 제발 링크를 게시하지 말고 "* 어떻게해야합니까 x? *" – Dom

+0

이런 ... 정말 내가 코드를 보여줄 필요가 있다고 생각하지 않았다 ... – EZDC

답변

1

문제는 동적 콘텐츠에 초점을 맞추지 못하고 있습니다. 문제는 overflow: auto없이 position: fixed을 사용했기 때문에 내용을 스크롤 할 수 없다는 것입니다. 문의 양식을 스크롤 할 수있게하려면 에 대한 CSS에 overflow: auto을 추가하십시오.

+0

이것은 도움이된다. 이제 두 개의 스크롤 막대가 생깁니다. 일반적인 라이트 박스처럼 하나만 유지할 수 있습니까? 어쩌면 이것은 채팅 convo에 더 좋습니다. – EZDC

+0

@ user980988 - 모달이 보이면,'body'에'overflow : hidden'을 설정하십시오. – gilly3

관련 문제