•  10-12-2019
  •  | 
  •  

質問

プロバイダホストのハイトラックスアプリを使用してアプリ部分を正常に作成しました。

アプリはブートストラップを使用し、動的コンテンツをページサイズに合わせるようにします。問題は、私がApp / Webパーツを公開したとき、生成されたIFRAMEとDIVを含むと、固定の高さと幅があります。

必要なのは、私のApp Partの生成されたIFrameには、widthプロパティなしでwidth=100%とMy Div class= "ms-webpart-chrome-title"のプロパティがあることです（300pxのデフォルトを取得）。

これをChromeで直接変更することができ、変更を確認できますが、私のSharePointアプリでこれを設定する場所はわかりません。

事前感あり

役に立ちましたか？

解決

私はちょうど他の日（しかし高さと共に）この問題を抱えていました。キーはPostMessageを使用してIFrameの幅を設定することです。これは私のために働いていました（アプリの.aspxファイルに入れます）： 

<body>
<div id="dynamicContent">
//App content here
</div>


<script type="text/javascript">
    "use strict";
    window.Communica = window.Communica || {};

    $(document).ready(function () {
        Communica.Part.init();
    });

    Communica.Part = {
        senderId: '',

        init: function () {
            var params = document.URL.split("?")[1].split("&");
            for (var i = 0; i < params.length; i = i + 1) {
                var param = params[i].split("=");
                if (param[0].toLowerCase() == "senderid")
                    this.senderId = decodeURIComponent(param[1]);
            }


            this.adjustSize();
        },

        adjustSize: function () {
            var step = 30,
                newHeight,
                contentHeight = $('#userDataContent').height(),
                resizeMessage = '<message senderId={Sender_ID}>resize({Width}, {Height})</message>';

            newHeight = (step - (contentHeight % step)) + contentHeight;

            resizeMessage = resizeMessage.replace("{Sender_ID}", this.senderId);
            resizeMessage = resizeMessage.replace("{Height}", newHeight);
            resizeMessage = resizeMessage.replace("{Width}", "100%");

            window.parent.postMessage(resizeMessage, "*");
        }
    };
</script>
</body>
.

#userDataContentをあなたのmain div id name に置き換えます。

ここに、（私のスクリプトがほとんど同じように見えるように）情報を見つけた場所です。 http://ctp-ms.blogspot.com/2013/03/resizing-app-parts-with-postmessage-in.html

他のヒント

これを使ったことは最初に幅を作成し、串刺された高さを得ないように高さと幅を再現しました。 

Communica.Part = {
                senderId: '',

                init: function () {
                    var params = document.URL.split("?")[1].split("&");
                    for (var i = 0; i < params.length; i = i + 1) {
                        var param = params[i].split("=");
                        if (param[0].toLowerCase() == "senderid")
                            this.senderId = decodeURIComponent(param[1]);
                    }

                    this.adjustWidth();
                },

                recall: function () {
                    var params = document.URL.split("?")[1].split("&");
                    for (var i = 0; i < params.length; i = i + 1) {
                        var param = params[i].split("=");
                        if (param[0].toLowerCase() == "senderid")
                            this.senderId = decodeURIComponent(param[1]);
                    }

                    this.adjustHeight();
                },

                adjustWidth: function () {
                    var step = 30,
                        newHeight,
                        contentHeight = $('#summary_content').height(),
                        resizeMessage = '<message senderId={Sender_ID}>resize({Width}, {Height})</message>';

                    newHeight = (step - (contentHeight % step)) + contentHeight;
                    resizeMessage = resizeMessage.replace("{Sender_ID}", this.senderId);                        
                    resizeMessage = resizeMessage.replace("{Width}", "100%");
                    window.parent.postMessage(resizeMessage, "*");
                },

                adjustHeight: function () {
                    var step = 30,
                        newHeight,
                        contentHeight = $('#summary_content').height(),
                        contentWidth = $('#summary_content').width(),
                        resizeMessage = '<message senderId={Sender_ID}>resize({Width}, {Height})</message>';

                    newHeight = (step - (contentHeight % step)) + contentHeight;
                    console.log(contentHeight)
                    resizeMessage = resizeMessage.replace("{Sender_ID}", this.senderId);
                    resizeMessage = resizeMessage.replace("{Height}", newHeight);
                    resizeMessage = resizeMessage.replace("{Width}", contentWidth);

                    window.parent.postMessage(resizeMessage, "*");
                }
            };
.

ライセンス： CC-BY-SA と 帰属
所属していません sharepoint.stackexchange
scroll top