纸张对话框中的分层纸张下拉菜单

Question

我正在制作一个应用程序原型，它会在用户进入配置选项时打开几层对话框。我想在其中一个对话框中使用 paper-dropdown-menu。它完全显示在其父级中，导致出现滚动条。我希望它出现在同一个地方但溢出父级。

您可以看到它的外观：paper-dropdown-menu demo page。只需点击切换叠加并打开中间弹出的菜单。

我尝试了多种定位变体，似乎都不起作用。

有没有想不通的方法？

Answer 1

分层属性应该理顺事情。聚合物博客上有一些关于如何使用它的内容。 https://blog.polymer-project.org/releases/2014/11/12/release-0.5.1/ 只需查找有关破坏子结构的部分。

编辑：回顾您链接的演示。他们在叠加层的下拉菜单中使用分层属性。看起来这可能是 core-overlay 的一个错误，我最近看到它有一些奇怪的行为。但是 layered 属性是我们应该在这种情况下使用的。

Answer 2

这有什么帮助吗？ https://github.com/Polymer/paper-dialog/issues/50#issuecomment-76563028

我运行在将分层 <paper-dropdown-menu> 放入分层 <paper-dialog> 中遇到了问题，因为它们都使用了具有相同 z-index 的单独 <core-overlay-layer> 元素。添加新叠加层时，我做了一些变通方法来重新编号它们的 z-index。

   domReady: function () {
        jQuery("body").on('core-overlay-open', function(e) {
            var zi = 1000;
            jQuery("core-overlay-layer").each(function (ei, elem) {
                elem.style.zIndex = zi--;
            });
        });
    },

纸张对话框中的分层纸张下拉菜单

Layered paper-dropdown-menu in paper-dialog

web-component

polymer

material-design

paper-elements