I have an external javascript that is called into a html page. The lines of javascript I am having problems with are as follows:
document.getElementById('lsb').innerHTML = '<iframe src="http://domain.com/feeds/" id="frame" frameBorder="0" style="border: none; width: 100%; min-width: 100%;" onLoad="calcHeight();" ></iframe>';
function calcHeight(){
var the_height= document.getElementById('frame').contentWindow.document.body.scrollHeight;
document.getElementById('frame').height=the_height;
}
Now the interesting part is that this code works, when the fame is called the height is adjusted to that of its content so there is no scroll bar. However, if the src value of the iframe is not local to the javascript file and html then it doesn’t work, the height value is not set.
Does anyone know why this is, or have an alternative script?
Thanks in advance, and happy valentines day 🙂
This is a cross-domain issue, most browsers will not allow you to access/manipulate contents coming from different domain. This is a browser security restrictions.