将纸张对话框限制为特定元素而不是窗口

Question

我有一个pl-loader元素：                                             

<dom-module id="pl-loader">
    <style is="custom-style" include="iron-flex iron-flex-alignment iron-positioning">
        :host{
            @apply(--layout-horizontal);
            @apply(--layout-center-justified);
        }
        :host paper-dialog{
            @apply(--layout-vertical);
            @apply(--layout-center-justified);
            background-color:transparent;
            width:100px;
            height:100px;
            box-shadow:none;
            padding:none;
        }
        :host paper-dialog paper-spinner-lite{
            --paper-spinner-stroke-width: 6px;
            --paper-spinner-color: var(--primary-color);
            width:100%;
            height:100%;
            padding-left:0px;
            padding-right:0px;
        }
  </style>
  <template>
        <content>
            <paper-dialog id="plLoaderDialog" fit-into="" auto-fit-on-attach="true" entry-animation="fade-in-animation"
              exit-animation="fade-out-animation" modal>
                <paper-spinner-lite active></paper-spinner-lite>
            </paper-dialog>
        </content>
    </template>
  <script>
        HTMLImports.whenReady(function(){
        Polymer({
            is: "pl-loader",
                properties: {
                    status: {
                        type: Boolean,
                        notify: true,
                        reflectToAttribute: true
                    }
                },

            ready: function(){
                    this.$.plLoaderDialog.fitInto = this;
                    this.open();
                },

                status: function(e){
                    if(this.hasAttribute('hidden')){ return true } return false;
                },

                open: function(e){
                    var dialog = this.$.plLoaderDialog;
                    dialog.open();
                    this.removeAttribute('hidden');
                },

                close: function(e){
                    var dialog = this.$.plLoaderDialog;
                    dialog.close();
                    this.setAttribute('hidden', true);
                }
        });
    });
  </script>
</dom-module>

我导入并使用了paper-dialog，我怎样才能将其背景限制为此元素？或者页面上的特定元素而不是整个窗口？

我已经尝试了this.$.plLoaderDialog.fitInto = this;但没有任何作用..

可以看到它的效果here。我不希望蓝色纸标题被背景覆盖。

此外，this.$.plLoaderDialog.setAttribute(fit-into, this)以某种方式运作我想要的方式，但会出现错误iron-fit-behavior.html:89 Uncaught TypeError: this.fitInto.getBoundingClientRect is not a function，这会破坏我的元素布局。