2016-11-24 1 views
0

너비가 100 % (2000px) 넘은 페이지가 있습니다. 페이지 끝의 버튼에서 대화 상자를 표시하려면 (가로 페이지로), 창을 페이지 시작 부분 (가로 페이지로)으로 스크롤하고 대화 상자를 표시하십시오. 내가 AngularJS와 1.5 및 최신 각도 소재 JS를 사용 codepen페이지 끝에서 대화 상자를 열 때 창 스크롤 시작

$mdDialog.show(
     $mdDialog.alert() 
     .parent(angular.element(document.querySelector('#popupContainer'))) 
     .clickOutsideToClose(true) 
     .title('This is an alert title') 
     .textContent('You can specify some description text in here.') 
     .ariaLabel('Alert Dialog Demo') 
     .ok('Got it!') 
     .targetEvent(ev) 
    ); 
    }; 

:

enter image description here

내 코드입니다.

페이지 끝 (가로 페이지 기준)의 단추에서 대화 상자를 표시하고 페이지 시작 부분으로 스크롤하지 않는 방법은 무엇입니까?

+0

Chrome 54.0.2840.99에서 테스트 중이었고 페이지의 가장 왼쪽으로 스크롤하지 않았습니다. 스크롤 막대가 전혀 스크롤되지 않습니다. 어떤 웹 브라우저 및 어떤 버전을 사용하고 있습니까? – attomos

+0

내 질문을 이미지로 업데이트했습니다. 감사. 팔레트 왼쪽으로 스크롤하지는 않지만 가로 페이지의 현재 위치에는 나타나지 않습니다. 버튼을 클릭하면 페이지 왼쪽에 경고가 표시됩니다. 페이지의 끝 부분에 현재 페이지 위치가 표시되기를 원합니다. –

+0

해결 방법을 찾았습니다. 체크 아웃 this. –

답변

0

다음 CSS를 추가 할 수 있습니다.

.md-dialog-container { 
    width: 2000px; 
} 

md-backdrop { 
    width: 2000px; 
} 

md-dialog { 
    position: absolute; 
    top: 25%; 
    right: 10%; 
} 

이 대화 컨테이너와 배경의 폭을 조정합니다.
그런 다음 원하는 방식으로 대화 상자를 배치하십시오.

CodePen을 참조하십시오.

+0

확인해 주셔서 감사합니다. –

관련 문제