Iframe sizing problem on Android phone

edited May 2012 in Enyo 1.0
With the code below, whether I instantiate an "Iframe" kind or set the content to the HTML, ...

        { kind: "Scroller", name: "teeTimeScroller", flex: 1, components: [
//            { kind: "Iframe", name: "webview", url: "http://cnn.com", classes: "enyo-fit", pack: 1 }
            { name: "webview", content: '<iframe src="http://cnn.com" class="enyo-fill" style="border: none; width: 100%; height: 100%;"></iframe>'}
        ] },
the Iframe displays the content in Chrome, but not in the Android WebView - the scroller's area is just blank. On the phone, the Android browser control seems to be unable to figure out how to size the Iframe. If I put hard coded width and height styles in the Iframe tag, then that works ... but I don't want to have to do that.

Any ideas?

Comments

  • edited May 2012
    Ok, so I got around it by manually applying styles for width and height based on that of the containing scroller.
    
            this.$.webview.applyStyle("width", this.$.teeTimeScroller.node.clientWidth  + "px");
            this.$.webview.applyStyle("height", this.$.teeTimeScroller.node.clientHeight + "px");
    
    But is that the right/best way to do this?
  • cookie, check your speeling for iframe kind, you have "Iframe" but it's "iframe". That will make a difference...
  • I'm having an issue on iphone. The frame displays only the the height of the window. Nothing renders beyond that. I know ios does not play well with frames but is there a work around?
Sign In or Register to comment.