9

私はこのページに取り組んでいます: http://factor1hosting.com/~dnaz/wordpress/certifications/

そして、クロスドメインiframeを取り込もうとしています。

これを実現するために、 @DavidJBradshaw の iFrame Resizerを使用しています。ただし、iframe が正しく機能しません。

プレーンな JavaScript init だけを使用できます。

<script>iFrameResize({log:true})</script>

これを使用すると、ログは取得されますが、サイズは変更されません。jQueryメソッドも試しました：

$('iframe').iFrameResize( [{log: true}] );

また、ログや iframe のサイズを変更しないでください。また、準備ができているドキュメントにラップしようとしましたが、それも達成されません。

なぜこれが正しく起動しないのかについて、考えやアイデアを持っている人はいますか? 私のコンソールは JS エラーをスローしていません... ありがとう!

編集:これは、HTML側で現在どのようにセットアップされているかの例です。

<iframe src="http://phpstack-9420-21004-48731.cloudwaysapps.com/onlinecert/certification/login" width="100%" scrolling="no"></iframe>
                <script>
                    jQuery(document).ready(function () {
                        jQuery('iframe').iFrameResize( [{log:true}] );
                    });
                </script>

EDIT 2 :これは私のコンソールログです。

[iFrameSizer][Host page] Added missing iframe ID: iFrameResizer0 (http://phpstack-9420-21004-48731.cloudwaysapps.com/onlinecert/certification/login)
iframeResizer.js:97 
[iFrameSizer][Host page] IFrame scrolling disabled for iFrameResizer0
iframeResizer.js:97 
[iFrameSizer][Host page][init] Sending msg to iframe (iFrameResizer0:8:false:true:32:true:true:null:offset:null:null:0:false:parent)
iframeResizer.js:97 
[iFrameSizer][Host page][iFrame.onload] Sending msg to iframe (iFrameResizer0:8:false:true:32:true:true:null:offset:null:null:0:false:parent)
iframeResizer.contentWindow.js:62 
[iFrameSizer][iFrameResizer0] HTML & body height set to "auto"
iframeResizer.contentWindow.js:62 
[iFrameSizer][iFrameResizer0] Enable public methods
iframeResizer.contentWindow.js:62 
[iFrameSizer][iFrameResizer0] Added event listener: Animation Start
iframeResizer.contentWindow.js:62 
[iFrameSizer][iFrameResizer0] Added event listener: Animation Iteration
iframeResizer.contentWindow.js:62 
[iFrameSizer][iFrameResizer0] Added event listener: Animation End
iframeResizer.contentWindow.js:62 .
[iFrameSizer][iFrameResizer0] Added event listener: Device Orientation Change
iframeResizer.contentWindow.js:62 
[iFrameSizer][iFrameResizer0] Added event listener: Transition End
iframeResizer.contentWindow.js:62 
[iFrameSizer][iFrameResizer0] Added event listener: Window Clicked
iframeResizer.contentWindow.js:62 
[iFrameSizer][iFrameResizer0] Enable MutationObserver
iframeResizer.contentWindow.js:62 
[iFrameSizer][iFrameResizer0] In page linking not enabled
iframeResizer.contentWindow.js:62 
[iFrameSizer][iFrameResizer0] Trigger event lock on
iframeResizer.contentWindow.js:62 
[iFrameSizer][iFrameResizer0] Sending message to host page (iFrameResizer0:150:703:init)
iframeResizer.js:97 
[iFrameSizer][Host page] Received: 
[iFrameSizer]iFrameResizer0:150:703:init
iframeResizer.js:97 [iFrameSizer][Host page] Checking connection is from: http://phpstack-9420-21004-48731.cloudwaysapps.com
iframeResizer.js:97 
[iFrameSizer][Host page] Checking height is in range 0-Infinity
iframeResizer.js:97 
[iFrameSizer][Host page] Checking width is in range 0-Infinity
iframeResizer.js:97 
[iFrameSizer][Host page] Requesting animation frame
iframeResizer.js:97 
[iFrameSizer][Host page] IFrame (iFrameResizer0) height set to 150px
iframeResizer.contentWindow.js:62 
[iFrameSizer][iFrameResizer0] Trigger event lock off
iframeResizer.contentWindow.js:62 
[iFrameSizer][iFrameResizer0] --
4

1 に答える 1

17

とった！

iframe 本体の高さが正しく計算されていなかったので、iframe の高さの計算方法を変更しました。私は'lowestElement'これを達成するために使用していますが、うまく機能します。

iFrameResize({
    log                     : true,                  // Enable console logging
    enablePublicMethods     : true,                  // Enable methods within iframe hosted page
    heightCalculationMethod : 'lowestElement',
});

GitHub リポジトリから: DOM 内のすべての要素をループし、最低の底点を見つけます。

于 2015-07-29T16:39:53.750 に答える