Angular 1材質設計在關閉Firefix對話框後滾動到頂部

嗨，當我在Firefox中使用Angular材質打開一個對話框窗口。對話框關閉後，頁面會滾動到頂部。任何人都可以解釋爲什麼發生這種情況或有一個解決方法。Angular 1材質設計在關閉Firefix對話框後滾動到頂部

見https://codepen.io/WitteStier/full/EmzKQb/

HTML

<html lang="en"> 
<head> 
    <meta name="viewport" content="width=device-width, initial-scale=1"> 
</head> 
<body ng-app="App" ng-controller="AppCtrl"> 

    <div style="height:1500px;">Scroll down</div> 

    <md-button ng-click="openDialog($event)"> 
     Open dialog 
    </md-button> 

    <div style="visibility: hidden"> 
     <div class="md-dialog-container" id="dialog-window"> 
     <md-dialog> 
      <md-toolbar> 
      <div class="md-toolbar-tools"> 
       <h2>Hi</h2> 
      </div> 
      </md-toolbar> 
      <md-dialog-content> 
      <div class="md-dialog-content"> 
       <p>Creativity is hard to define.</p> 
      </div> 
      </md-dialog-content> 
     </md-dialog> 
     </div> 
    </div> 

</body> 
</html>

angular.module('App', ['ngMaterial']) 
    .controller('AppCtrl', function($scope, $mdDialog) { 
    $scope.openDialog = function(ev) { 
     $mdDialog.show({ 
     contentElement: '#dialog-window', 
     parent: angular.element(document.body), 
     targetEvent: ev, 
     }); 
    }; 
    });

來源

2017-05-27 WitteStier

有幾個問題打開有關此https://github.com/angular/material/issues/10897 –

看起來它固定在此上拉請求： https://github.com/angular/material/pull/10549 更新您的角材版本1.1.5，它應該管用。

來源

2017-09-13 00:52:11

這是一種解決方法。只需將滾動從body元素移動到內部元素，如下所示：

<body> 
    <div id="container"> 
     ... Your content ... 
    </div> 
</body> 

body{ 
    height: 100%; 
    width: 100%; 
    overflow: hidden; 
} 

#container{ 
    height: 100%; 
    width: 100%; 
    overflow-y: scroll; 
}

來源

2017-09-27 07:02:49

Angular 1材質設計在關閉Firefix對話框後滾動到頂部

回答

相關問題