Hi there, i think origianlly i obtained the code below from these forums, which works a charm when resizing iframes according to their content.
The way i use it for, is that artist information is grabbed from last.fm and shown in an iframe, which refreshes every 10 seconds in accordance to the latest now playing information from our system. Therefore with each new artist, there is different content published to the iframe depending on the details on that artist from the last.fm website, hence why the iframe needs to be resized.
However, the code does not work as well as it should in Google Chrome, Safari, and IE8 (the latest IE). In these browsers, instead of resizing the iframe, every 10 seconds it will add about 100px to the bottom of the iframe and continue to do this over and over, meaning the page continues to stretch and stretch and stretch! This is a real pain obviously!
Here is the code below.
Code:
<script type="text/javascript">
var iframeids=["artistiframe"]
var iframehide="yes"
var getFFVersion=navigator.userAgent.substring(navigator.userAgent.indexOf("Firefox")).split("/")[1]
var FFextraHeight=parseFloat(getFFVersion)>=0.1? 16 : 0
function resizeCaller() {
var dyniframe=new Array()
for (i=0; i<iframeids.length; i++){
if (document.getElementById)
resizeIframe(iframeids[i])
if ((document.all || document.getElementById) && iframehide=="no"){
var tempobj=document.all? document.all[iframeids[i]] : document.getElementById(iframeids[i])
tempobj.style.display="block"
}
}
}
function resizeIframe(frameid){
var currentfr=document.getElementById(frameid)
if (currentfr && !window.opera){
currentfr.style.display="block"
if (currentfr.contentDocument && currentfr.contentDocument.body.offsetHeight)
currentfr.height = currentfr.contentDocument.body.offsetHeight+FFextraHeight;
else if (currentfr.Document && currentfr.Document.body.scrollHeight)
currentfr.height = currentfr.Document.body.scrollHeight;
if (currentfr.addEventListener)
currentfr.addEventListener("load", readjustIframe, false)
else if (currentfr.attachEvent){
currentfr.detachEvent("onload", readjustIframe)
currentfr.attachEvent("onload", readjustIframe)
}
}
}
function readjustIframe(loadevt) {
var crossevt=(window.event)? event : loadevt
var iframeroot=(crossevt.currentTarget)? crossevt.currentTarget : crossevt.srcElement
if (iframeroot)
resizeIframe(iframeroot.id);
}
function loadintoIframe(iframeid, url){
if (document.getElementById)
document.getElementById(iframeid).src=url
}
if (window.addEventListener)
window.addEventListener("load", resizeCaller, false)
else if (window.attachEvent)
window.attachEvent("onload", resizeCaller)
else
window.onload=resizeCaller
</script>
Hopefully you can help so that the code works as it should in Chrome, Safari and IE8, instead of continuing to stretch the page!
Bookmarks