0

hamlビュー内にiframeがあります。コンテンツの高さに応じてサイズを変更したいだけです。

index.html.hamlの上部にあります：

:javascript
   $(document).ready(function(){
      document.getElementById('doc').style.height =     
      document.getElementById('doc').contentWindow.document.body.scrollHeight + "px";
   })

%iframe{id: "doc", src: "https://docs.google.com/document/d/10Kc15lbqAcbIgkN5SsqZCXTIY2UZvbDS1DrwhzOdT1Y/edit", align: "middle"}

ページが読み込まれると、次のエラーが発生します。

Viewport argument key "minimum-scale:1.0" not recognized and ignored. 
Viewport argument key "maximum-scale:1.0" not recognized and ignored.

これ

document.getElementById('doc').style.height

150pxを返します

これ

document.getElementById('doc').contentWindow.document.body.scrollHeight + "px"

戻り値

Unnsafe JavaScript attempt to access frame with URL https://docs.google.com/document/d/10Kc15lbqAcbIgkN5SsqZCXTIY2UZvbDS1DrwhzOdT1Y/edit from frame with URL http://localhost:3000/projects/1/specifications/4. Domains, protocols and ports must match.
TypeError: Cannot read property 'body' of undefined
4

1 に答える 1

1

ページの高さの設定を処理するために、モバイル用のjavascriptインクルードを使用しました。横向き/縦向きのビューに基づいて高さを変更するためのjs/cssを含めることができます

  :javascript
  var viewport = $('meta[name=viewport]').attr("your selector");
  $(window).bind( 'orientationchange', function(e){
    if ($.event.special.orientationchange.orientation() == "portrait") {
      $(this).setAttribute("your selector", "height=device-height, initial-scale=1.0");
    } else {
      //Do Whatever in landscape mode
      $(this).setAttribute("your selector", "width=device-width, initial-scale=1.0, maximum-scale=1.0");
    }
  });
于 2012-10-16T19:45:12.570 に答える