在页面末尾打开对话框时开始滚动窗口答案

【问题标题】：Window scroll to start when open dialog at the end of page在页面末尾打开对话框时开始滚动窗口
【发布时间】：2017-06-05 20:54:44
【问题描述】：

我有一个宽度超过 100% (2000px) 的页面。当我单击以从页面末尾的按钮显示对话框（按水平页面）时，窗口滚动到页面的开头（按水平页面）并显示对话框。

这是我的代码：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)
    );
  };

我使用 angularjs 1.5 和最新的 angular material js。

如何从页面末尾的按钮显示对话框（按水平页面）并且窗口不滚动到页面的开头？

【问题讨论】：

我在 Chrome 54.0.2840.99 上进行测试，它不会滚动到页面的最左侧。滚动条根本不滚动。您使用的是什么网络浏览器和哪个版本？
我用图片更新了我的问题。谢谢。虽然它不会向左滚动，但它不会显示在水平页面的当前位置。当我点击进入按钮时，页面左侧会显示警报。我希望它显示在页面当前位置的页面末尾。
我找到了解决方法。签出stackoverflow.com/questions/44222457/…>。
我找到了解决方法。签出stackoverflow.com/questions/44222457/…>。

标签： javascript html css angularjs angular-material

【解决方案1】：

您可以添加以下 CSS。

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

md-backdrop {
  width: 2000px;
}

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

它调整对话框容器和背景的宽度。
然后，按照您想要的方式定位对话框。

查看工作中的CodePen。

【讨论】：