Menu
Just a random thought, What if I wanted to showcase a responsive webdesign not by resizing the browser window, but actually loading the responsive site in an IFRAME having the same dimension as that of a mobile screen. Can this work?
assuming that I have an IFRAME
<iframe src="something" id="viewPort"/>
into which I load the responsive website. and then let the user test by adjusting the iframe width and height in their browser.
IF this can work it can be a boon for clients who don't know a thing about browsers.
341
The ” iframe ” tag defines a rectangular region within the document in which the browser can display a separate document, including scrollbars and borders. An inline frame is used to embed another document within the current HTML document. For the fullscreen Iframe, you have to cover the entire viewport.
You can use the JavaScript contentWindow property to make an iFrame automatically adjust its height according to the contents inside it, so that no vertical scrollbar will appear.
The iframe itself ('the box') can be responsive. But everything inside the iframe is a separate page, and therefore not in the domain of your CSS nor JS.
I win :) There is one, well known, you can either use or learn from.
http://mattkersley.com/responsive/
To be more specific, iframe absolutely does allow you to change height and width and its content does respond to that - that is to say - @media works.
53
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
