위치가있는 팝업 div 내로 스크롤 : fixed

위치가 고정 된 팝업이 있습니다. 본문 스크롤을 사용하지 않기를 원하므로 body {overflow-y : hidden}가 있습니다. 팝업에는 많은 콘텐츠가 있습니다. 그래서 오버플로가 있습니다 : 팝업으로 스크롤하고 스크롤을 많이합니다.위치가있는 팝업 div 내로 스크롤 : fixed

이 팝업에서 특정 요소 (위치는 고정되어 있고 많은 스크롤이 있음)로 스크롤하고 싶습니다.

<body style="overflow-y: hidden;"> 
    <div class="popup" style="position: fixed; overflow-y:scroll; ... "> 
     .... 
     .... 

     .... really long content 
     <h4>here</h4> 
     .... 
     .... 
    </div> 
</body>

이하는 :(

$('html, body').animate({ 
    scrollTop: $("h4").offset().top 
}, 2000);

어느 쪽이 작동하지 않습니다 : 나는

HTML 구조가이 같은 것입니다 팝업 :(withing에 태그에 페이지를 스크롤 할 수 없습니다 : (

$('.popup').animate({ 
     scrollTop: $("h4").offset().top 
    }, 2000);

어느 쪽이 :(

다른 아이디어

jQuery.fn.scrollTo = function(where, speed) { 
    $(this).animate({ 
     scrollTop: $(this).scrollTop() - $(this).offset().top + where 
    }, speed == undefined ? 1000 : speed); 
    return this; 
}; 
$("#custom_development_popup").scrollTo($("h4").offset().top, 300);

출처

2014-04-14 Kaloyan Kosev

당신이 문제는 jQuery (javascript)를 통해 CSS 문제를 해결하려고한다는 것입니다.

이 피들을 확인하고 수행하려는 작업을 확인하십시오.

http://jsfiddle.net/w3QZc/1/

기본적으로 내가 사업부와 몸 태그에서 떨어져 CSS를 설명했다. JS가없는 것을 볼 수 있습니다. 이것이 당신이하려는 일이 아니라면 우리에게 더 많은 맥락을주고 질문을 더 잘 설명하십시오.

body{ 
    overflow-y: hidden; 
} 

.popup{ 
    background-color: #eee; 
    border: 1px solid #000; 
    position: fixed; 
    overflow-y:scroll; 
    height: 200px; 
    width: 400px; 
    padding: 20px; 
    margin: 30px; 
}

출처

2014-04-14 17:24:54

위치가있는 팝업 div 내로 스크롤 : fixed

답변

관련 문제