robust and progressive method here<\/a>.<\/div>\n","protected":false},"excerpt":{"rendered":"Hides iframe until fully loaded. <iframe style=”visibility:hidden;” onload=”this.style.visibility = ‘visible’;” src=”..\/examples\/inlineframes1.html” > <\/iframe> Much more robust and progressive method here.<\/p>\n","protected":false},"author":3,"featured_media":0,"parent":3231,"menu_order":0,"comment_status":"open","ping_status":"closed","template":"page-snippet.php","meta":{"_bbp_topic_count":0,"_bbp_reply_count":0,"_bbp_total_topic_count":0,"_bbp_total_reply_count":0,"_bbp_voice_count":0,"_bbp_anonymous_reply_count":0,"_bbp_topic_count_hidden":0,"_bbp_reply_count_hidden":0,"_bbp_forum_subforum_count":0,"sig_custom_text":"","sig_image_type":"featured-image","sig_custom_image":0,"sig_is_disabled":false,"inline_featured_image":false,"c2c_always_allow_admin_comments":false,"footnotes":""},"tags":[],"acf":[],"jetpack-related-posts":[{"id":4422,"url":"https:\/\/css-tricks.com\/snippets\/jquery\/fit-iframe-to-content\/","url_meta":{"origin":3844,"position":0},"title":"Resize Iframe to Fit Content (Same Domain Only)","date":"January 1, 2010","format":false,"excerpt":"Normally you set and width and height for iframes. If the content inside is bigger, scrollbars have to suffice. The script below attempts to fix that by dynamically resizing the iframe to fit the content it loads. Will resize an iframe like this: \u00a0 View Demo Still problematic... The source\u2026","rel":"","context":"In "Article"","img":{"alt_text":"","src":"","width":0,"height":0},"classes":[]},{"id":15957,"url":"https:\/\/css-tricks.com\/snippets\/javascript\/break-out-of-iframe\/","url_meta":{"origin":3844,"position":1},"title":"Break Out of iframe","date":"January 9, 2012","format":false,"excerpt":"if (top.location!= self.location) { top.location = self.location.href; } That will generally work, but there is a small chance of failure in the case that window is overridden. Here's a couple of clever alternatives from Nathan Smith:","rel":"","context":"With 14 comments","img":{"alt_text":"","src":"","width":0,"height":0},"classes":[]},{"id":15365,"url":"https:\/\/css-tricks.com\/snippets\/html\/post-data-to-an-iframe\/","url_meta":{"origin":3844,"position":2},"title":"Post Data to an Iframe","date":"December 1, 2011","format":false,"excerpt":"Doesn't take any JavaScript or anything. You just have the form's target attribute match the iframe's name attribute. Some text: The outer page doesn't even reload. But it might appear to at first glance since many browsers run the page-loading spinner in the tab when an iframe reloads.","rel":"","context":"In \"iframes\"","img":{"alt_text":"","src":"","width":0,"height":0},"classes":[]},{"id":18228,"url":"https:\/\/css-tricks.com\/lodge\/v10\/029-integrating-fitvids-js\/","url_meta":{"origin":3844,"position":3},"title":"#029: Integrating FitVids.js","date":"September 12, 2012","format":false,"excerpt":"Images aren't the only media that need to play nice within our flexible grid. And images were easy compared to video! When you set the width of an and override its height value to auto, the image will naturally retain its aspect ratio. This is also true of , but\u2026","rel":"","context":"With 10 comments","img":{"alt_text":"","src":"","width":0,"height":0},"classes":[]},{"id":253584,"url":"https:\/\/css-tricks.com\/almanac\/properties\/f\/font-display\/","url_meta":{"origin":3844,"position":4},"title":"font-display","date":"April 17, 2017","format":false,"excerpt":"The font-display property defines how font files are loaded and displayed by the browser. It is applied to the @font-face rule which defines custom fonts in a stylesheet. @font-face { font-family: 'MyWebFont'; \/* Define the custom font name *\/ src: url('myfont.woff2') format('woff2'), url('myfont.woff') format('woff'); \/* Define where the font can\u2026","rel":"","context":"In \"font-display\"","img":{"alt_text":"","src":"","width":0,"height":0},"classes":[]},{"id":13658,"url":"https:\/\/css-tricks.com\/snippets\/jquery\/force-iframe-to-reload\/","url_meta":{"origin":3844,"position":5},"title":"Force an Iframe to Reload","date":"August 17, 2011","format":false,"excerpt":"You can touch the src of it: $('iframe').attr('src', $('iframe').attr('src'));","rel":"","context":"In \"iframes\"","img":{"alt_text":"","src":"","width":0,"height":0},"classes":[]}],"_links":{"self":[{"href":"https:\/\/css-tricks.com\/wp-json\/wp\/v2\/pages\/3844"}],"collection":[{"href":"https:\/\/css-tricks.com\/wp-json\/wp\/v2\/pages"}],"about":[{"href":"https:\/\/css-tricks.com\/wp-json\/wp\/v2\/types\/page"}],"author":[{"embeddable":true,"href":"https:\/\/css-tricks.com\/wp-json\/wp\/v2\/users\/3"}],"replies":[{"embeddable":true,"href":"https:\/\/css-tricks.com\/wp-json\/wp\/v2\/comments?post=3844"}],"version-history":[{"count":4,"href":"https:\/\/css-tricks.com\/wp-json\/wp\/v2\/pages\/3844\/revisions"}],"predecessor-version":[{"id":286289,"href":"https:\/\/css-tricks.com\/wp-json\/wp\/v2\/pages\/3844\/revisions\/286289"}],"up":[{"embeddable":true,"href":"https:\/\/css-tricks.com\/wp-json\/wp\/v2\/pages\/3231"}],"wp:attachment":[{"href":"https:\/\/css-tricks.com\/wp-json\/wp\/v2\/media?parent=3844"}],"wp:term":[{"taxonomy":"post_tag","embeddable":true,"href":"https:\/\/css-tricks.com\/wp-json\/wp\/v2\/tags?post=3844"}],"curies":[{"name":"wp","href":"https:\/\/api.w.org\/{rel}","templated":true}]}}