Just a second with Iframe
Posted on 12. Nov, 2009 by Sajith M.R in php
IF you are facing problem with layout issues inside iframe (which is normally not there in normal pages) just test these things.
- Iframe is considered as a separate html page. So it needs all the basic tags, from html, head, body.
- It does not get styles from parent, so you need to add manually in the header
- Take care of javascript calls separated with parent and local (if anything related with parent , use parent. , for example, to access a jQuery script from parent use, parent.$.function_name)
- Avoid define styles inside body tag with <style> tags, place them in <head> tag
- To solve the layout issues, you must use the DOCTYPE tag at the beginning
- If you are using any autoheight scripts to control iframe height dynamically, remember, it may not work as expected in all browser. (jQuery autoheight plugin sometimes fails in OPERA)
<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd"> <html xmlns="http://www.w3.org/1999/xhtml" lang="en" xml:lang="en">
There is a saying that using iframe is a bad practise. I don’t know the fact, anyway gmail uses more than 5 iframes to implement all the features and works well. (See Gmail Architecture)
cigar
Nov 12th, 2009
Wooow, this is cool. Thank you so much. I know it now.