Adding An Iframe - Problems - javascript

I am trying to grab the Iframe from here:
http://www.neighbourhood.statistics.gov.uk/HTMLDocs/dvc126/
The code is here:
<iframe width=940 height=700 src="http://www.neighbourhood.statistics.gov.uk/HTMLDocs/dvc126/" scrolling=no frameborder=0/>
but when I add it in the plain text editor on WP it does not work, just a huge white space.
Now I am thinking this is a problem with the Iframe itself? It has no tag, so maybe this is why?

Check if your browser supports iframe or not. Check

Related

Setting iframe src via JS isnt working specifically for sharepoint

Setting src directly in iframe is working as expected
I'm trying to embed a Sharepoint document here.
For eg
<iframe src="https://rocketlane123-my.sharepoint.com/personal/lokeshkannan_rocketlane123_onmicrosoft_com/_layouts/15/Doc.aspx?sourcedoc={8822527b-0c56-44f9-8263-40c737db903c}&action=embedview"
width="476px"
height="288px" />
Whereas when I set the src in the script it's failing
<iframe id="x" width="476px" height="288px"></iframe>
<script>
document.getElementById('x').src = "https://rocketlane123-my.sharepoint.com/personal/lokeshkannan_rocketlane123_onmicrosoft_com/_layouts/15/Doc.aspx?sourcedoc={8822527b-0c56-44f9-8263-40c737db903c}&action=embedview";
</script>
This happens explicitly with SharePoint. So I would like to understand a couple of things here.
1. Am I doing something wrong?
2. Is there any CSP headers which block the parent from adding via JS?
3. Is there any official way from SharePoint to allow this?
3. Is there any way to hack this?
Thanks in advance.
Since this happens across chrome, safari and firefox I think it's not a bug in a specific browser.
Trying this in Firefox yields this error message:
To protect your security, login.microsoftonline.com will not allow
Firefox to display the page if another site has embedded it. To see
this page, you need to open it in a new window.
Opening the console gives this message:
The loading of [url] in a frame is denied by “X-Frame-Options“
directive set to “DENY“.
This is a header that's set by login.microsoft.com to disable embedding the link as an iframe.
This link details this design choice: https://learn.microsoft.com/en-us/sharepoint/troubleshoot/sites/cannot-display-sharepoint-pages-in-iframe
The link mentions you can override the behavior by setting 'AllowFraming', though it doesn't recommend it, as there may be site-breaking changes by embedding it.
A guide to use this feature can be found at this link
The problem is in, javascript amp; should not represent as &.
Change your link to
<body>
<iframe id="x" width="476px" height="288px"></iframe>
<script>
document.getElementById('x').src = "https://rocketlane123.sharepoint.com/sites/MyDocsforSP/_layouts/15/Doc.aspx?sourcedoc={6d327004-5d52-4e42-9707-c964631f8e65}&action=embedview";
</script>
</body>

document.location.href got javascript:window["contents"]

The return value of document.location.href will become javascript:window["contents"] sometimes.
When it will happened? how to avoid it?
I found out
The code is placed in an iframe without src url.
<iframe id="google_ads_iframe_/21202031/LTN-000-03-HOME-120X600-DISPLAY_0" name="google_ads_iframe_/21202031/LTN-000-03-HOME-120X600-DISPLAY_0" width="120" height="600" scrolling="no" marginwidth="0" marginheight="0" frameborder="0" src="javascript:"<html><body style='background:transparent'></body></html>"" style="border: 0px; vertical-align: bottom;"></iframe>
As you already have suspected, this indeed has to do with (I)Frames and more specifically, the way some scripts/libraries work with those frames.
It is a technique to avoid a ReferenceError (in IE) in some cases when loading an external javascript (that is loaded asynchronous) which holds/provides variables/objects that are used in the frame's inline-script-source.
To quote the most relevant part from an article called 'inject content into a new iframe' :
Instead of using document.open/write/close we use the following
approach:
iframe.contentWindow.contents = content;
iframe.src = 'javascript:window["contents"]';
First, we assign the dynamic content to a variable on the iframe’s
window object. Then we invoke it via the javascript: scheme. This not
only renders the HTML properly, but loads and executes the scripts in
the desired order.
This is also in-line with a similar answer on SO.
Hope this helps!
For me I have 3 tabs that open with Internet Explorer ... Yahoo, MSN and my email account. Went to "tools" >Internet Options and removed Yahoo, okay and closed. After I verified that I no longer got the java script error tab I reinstalled Yahoo and that solved the problem.

Javascript/Html: Load Html into FrameSet with onunload event

Explanation of problem in full below, you could probably just skip to the code at the bottom if you want.
What happened is a impatient client wanted his swf banners converted to html5 without having to actually code them from scratch. So i utilized Google's new tool, Swiffy. I then tried to place this new generated html5 page in the header of the clients wordpress site. I have gotten it to load as an iframe but the problem that I am encountering is when you click on a link on the loaded html5 page, it just loads the linked page in the iframe, not the parent page/window (which is to be expected). I tried a bunch of other methods, and tried changing the AS2 links in the .fla as well but no luck. I am guessing Swiffy can not read every AS2 code, and so it has been ignoring my "_blank", "_parent" when I use getURL. Anyway, I have been trying to get it so when the iframe unloads to go to the linked page, it uses Java to just open the link on the parent page. But iframes cant use the onunload event, but I am pretty sure framesets can. So this is the code I was trying and it doesnt work.
<frameset rows="100%" onunload="window.open('http://www.goaefis.com/about-aefis/what-is-aefis/','_parent');">
<frame src="www.goaefis.com/banner_Test.html" frameborder="0" scrolling="no" />
</frameset>
Any help will be super appreciated.
try to use the "target" on your frames.
Here's a example:
http://www.w3.org/TR/html4/present/frames.html

Prevent selection being greyed out in iframe in Firefox without using contenteditable

In Firefox 3 and later (and probably older versions), selecting content within an iframe always seems to use the grey selection background colour used for a document that doesn't currently have focus, even if the iframe does have focus. The only exception I have been able to find is when the content within the iframe is editable. This is not the case in other browsers. Here's an example illustrating this:
http://jsfiddle.net/97Vjz/
This unfortunately prevents styling the selection within an iframe using the ::-moz-selection CSS pseudo-element because it only applies to non-grey selections:
http://jsfiddle.net/YYXSY/1/
My question is: is it possible to prevent an iframe's selection being grey in Firefox without using contenteditable / designMode?
UPDATE
This only seems to happen on dynamically written iframes: using a separate file and the src attribute solves the problem. However, I do need it to work with dynamically written iframes.
I just tried to reproduce the problem with a "real" page as iframe content and then it works like you want: blue colored selection! (FF 5.0)
see: http://jsfiddle.net/97Vjz/8/
It seems only generated content has this problem, so you could make a page (php/asp(x)) that generates the content for you to circumvent the problem.
Another solution to use javascript generated content is to load it with src="javascript:'<html />'" (actually this is Tim's own solution from the comments below.)
A simple example script: http://jsfiddle.net/97Vjz/9/
iframe.src='javascript:\'<html><body>' + content + '</body></html>\'';
There is a property of the iframe exposed in Firebug's DOM inspector contentDocument->designMode which is set to false for you iFrames. Forcing it to true through the DOM inspector enables the blue highlight you're after.
Hypothesis: It seems that for dynamically written iFrames, either a XUL Iframe is rendered or the Gecko engine doesn't honor the styles.
Short of submitting a bug, the only workaround I can see is to wrap our contents in a textarea and style it to make it 'invisible': http://jsfiddle.net/mrchief/YYXSY/19/

Getting Iframes on mozilla

I'm using JavaScript on Mozilla (version 4). Once I get a DOM object and identify the tag as an IFRAME I'd like to get the content and the borders (x,y pixels)of the IFRAME, (if I understand correctly the Iframe is an additional HTML page inside another HTML).
Look here: https://developer.mozilla.org/en/DOM/HTMLIFrameElement
contentDocument and frameborder are probably what you are looking for.

Categories