Because the iframe element isn’t a self-closing element. The versions of Firefox and Safari you’re using are treating the /> at the end as just > and assuming everything after it is contained within the iframe. If we attempt to pass the code you’ve given through W3C’s validator we’ll see the following errors: Error: Self-closing … Read more
You can use a filter instead: HTML: <iframe src=”https://stackoverflow.com/questions/24163152/{{yourURL” trustAsResourceUrl}}”></iframe> where ‘yourURL’ is the URL of the iframe and ‘trustAsResourceUrl’ is the filter and is defined as in some module(like eg. filters-module) as: JS: angular.module(‘filters-module’, []) .filter(‘trustAsResourceUrl’, [‘$sce’, function($sce) { return function(val) { return $sce.trustAsResourceUrl(val); }; }]) And you can use this filter in all … Read more
The IFRAME element is part of the upcoming HTML5 standard. Also, HTML5 is developed by the major browser vendors out there (Mozilla, Opera, Safari, IE), that basically makes a guarantee that we will have an IFRAME element in the foreseeable future. Some of them have support for some HTML5 elements already, like AUDIO and VIDEO … Read more
If your target isn’t Opera 9 or lower and IE 9 or lower you can use css attribute pointer-events: none. I found it the best way just to ignore iframe. I add class with this attribute to iframe in onMouseDown event and remove in onMouseUp event. Works perfect for me.
Thing is, the code you provided won’t work because the <iframe> element has to have a “src” property, like: <iframe id=”uploads” src=”http://domain/page.html”></iframe> It’s ok to use .contents() to get the content: $(‘#uploads).contents() will give you access to the second iframe, but if that iframe is “INSIDE” the http://domain/page.html document the #uploads iframe loaded. To test … Read more
The problems were: iframe content comes from another domain iframe dimensions need to be adjusted for each video The solution based on omerkirk’s answer involves: Creating an iframe element Creating a dialog with autoOpen: false, width: “auto”, height: “auto” Specifying iframe source, width and height before opening the dialog Here is a rough outline of … Read more
$(“#button”).click(function () { $(“#frame”).attr(“src”, “http://www.example.com/”); }); HTML: <div id=”mydiv”> <iframe id=”frame” src=”” width=”100%” height=”300″> </iframe> </div> <button id=”button”>Load</button>
Easily by calling parent.your_var_name in your iframe’s script. One condition: both pages (main and iframe’s) have to be on the same domain. main page: <script> var my_var=”hello world!”; </script> iframe <script> function some_fn(){ alert(parent.my_var); //helo world! } </script>
Updated: October 2016 The seamless attribute no longer exists. It was originally pitched to be included in the first HTML5 spec, but subsequently dropped. An unrelated attribute of the same name made a brief cameo in the HTML5.1 draft, but that too was ditched mid-2016: So I think the gist of it all both from … Read more
You can make the request in javascript, setting any headers you’d like. Then you can URL.createObjectURL(), to get something suitable for the src of the iframe. var xhr = new XMLHttpRequest(); xhr.open(‘GET’, ‘page.html’); xhr.onreadystatechange = handler; xhr.responseType=”blob”; xhr.setRequestHeader(‘Authorization’, ‘Bearer ‘ + token); xhr.send(); function handler() { if (this.readyState === this.DONE) { if (this.status === 200) … Read more