Seamless iframes
by
, 04-21-2017 at 07:07 PM (14425 Views)
There are many scripts on the Internet that aim to set the height of the iframe element to accommodate the contained document's height, so that the window scrollbars can be used instead of iframe scrollbars for a more seamless appearance. Some rather well-known scripts are those created by David Bradshaw (http://davidjbradshaw.com/iframe-resizer/example, jQuery based) and Dynamic Web Coding (http://www.dyn-web.com/tutorials/ifr...eight/demo.php). The DynamicDrive script (http://www.dynamicdrive.com/dynamici...iframessi2.htm) is also fairly well known.
I tested the scripts and found the following issues:
- None of the above mentioned scripts produce iframes whose appearances are really seamless in the strongest sense of the word.
- The DynWeb iframes get scrollbars or superfluous space when the window is resized.
- The iframes produced by the Bradshaw script don't have enough height when the window is first resized and then reloaded, or vice versa. When this happens, we must click inside the iframe or on the toggle content button to get the correct height. Sometimes, simply resizing the window cuts off the bottom of the iframe's content.
With these observations in mind, I wrote my own 'seamless iframe script', see this. As far as I can see, it functions well. But one never knows, so if you observe problems with the script please tell me. It's free for use, of course.
(This replaces another script I wrote about seamless iframes, see http://www.dynamicdrive.com/forums/e...rame-attribute. The current script replaces that one).