대화 상자 내에서 div 태그의 위치 수정

Question

버튼을 클릭 할 때 나타나는 대화 상자가 있습니다. 대화 상자에는 버튼과 다른 내용이 있습니다. 대화 상자 팝업 내에서 버튼 위치를 고정시키고 싶습니다.

$(window).bind('scroll', function() { 
    if ($(window).scrollTop() > 50) { 
    $('#footer_buttons').addClass('sticky'); 

} 
else { 
    $('##footer_buttons').removeClass('sticky'); 
} 
}); 

<style> 
    .sticky{ 
    position : fixed; 
} 
</style> 

내가 버튼 위치 수정을 만들기 위해 위의 코드를 사용, 그것은 대화 상자 밖에서 일을하지만 같은 코드가 대화 상자 내부에 사용하는 경우 작동하지 않습니다. 대화 상자에 최소 높이를 추가하고 대화 상자 내용을 스크롤 할 수있게하여 버튼 수정을 할 수 있습니다. 그러나 대화 상자 안의 내용에 스크롤을 추가하고 싶지 않습니다. 어느 누구도 나를 도울 수 있습니까? MDN CSS position 재산에서 미리

Answer 1

감사 : 당신의 요소입니다

fixed: Do not leave space for the element. Instead, position it at a specified position relative to the screen's viewport and don't move it when scrolled. When printing, position it at that fixed position on every page.

그래서 그것은 중요하지 않습니다. fixed 위치를 적용하면 top, left, right, bottom 값은 화면의 뷰포트 (브라우저의 보이는 영역)에 대한 상대 값입니다.

귀하의 경우에는 absolute 위치 지정을 사용하고 네 가지 위치 지정 속성 중 두 가지를 사용하여 위치를 설정해야합니다 (위쪽, 오른쪽, 아래쪽, 왼쪽). 모달 컨테이너에 position: relative or absolute을 추가하는 것을 잊지 마십시오.