Menu
There is a responsive scheduling website that renders a mobile view when on a phone. I want show this webpage within my PhoneGap div that way i can keep my header and navigation. Regular iframe code seems not to work for me. Can someone give me a hint on how to get this working like in the screenshot below.
Here is what i currently have:
<div id="set" title="Set Appointment" class="panel">
<iframe width="320px" height="480px" src="http://google.com"></iframe>
</div>
887
To embed an iframe in a content page, select Interactive layout, choose the HTML block and paste the iframe code there. You can adjust the iframe width and height properties. To embed an iframe using the Old (Classic) editor, click on the Embed Media icon and paste the code in the appropriate field.
The iframe element is specified with the iframe tag. It may be placed anywhere in an HTML document, and thus anywhere on a web page. Iframes are most often used to embed specific content from one web page — like a video, form, document, or even a full web page — within a different web page.
Approach 1: For adding additional div's in an iframe, you need to use a wrapper div, that wraps the contents of your intended div and the iframe into one unit. This way you can display the contents of your div along with the iframe embedding to the document/webpage.
To generate iframe, you need to set a URL to embed, width and height, scroll, disable or enable border, specify border type, size and border color, and add the iframe Name. Then, click the “Create iframe“ button to generate HTML code and push the “Copy To Clipboard“ button for copying the result.
This works:
<iframe src="http://www.myschedulingwebsite.com/" style="width:100%; height:100%;">
Setting the height and width to 100% fills the containing div.
NOTE: If you attempt to embed an iframe using a website that can only be displayed in a frame on the same origin as the page itself, the web inspector will throw the error below:
Refused to display 'https://www.google.com/' in a frame because it set 'X-Frame-Options' to 'SAMEORIGIN'.
With that said, www.google.com and several other site's embedded iframes will always be blank. I hope this helps someone.
127
<iframe src="mypage.html" style="position:fixed; top:0px; left:0px; bottom:0px; right:0px; width:100%; height:100%; border:none; margin:0; padding:0; overflow:hidden; z-index:999999;">
Your browser doesn't support iframes
</iframe>
If you love us? You can donate to us via Paypal or buy me a coffee so we can maintain and grow! Thank you!
Donate Us With
