how to set the height of iframe to 100% of the content

hi i am going to give the oportunity to developers to use my page as resource for the bible. so they will add this script on their page:

<script type="text/javascript">
    quartelcristao_idb = "29";
    quartelcristao_idl = "692";
    quartelcristao_width = "950px";
</script>
<script src="http://www.quartelcristao.com/js/biblia/style01.js"></script>

but i want the iframe height to be 100% of the content. but not always is happening, don't know why. i try this on the style01.js file:

function QuartelCristao_Biblia_Resize_iframe() {
    var height = window.innerWidth; //Firefox
    if (document.body.clientHeight) {
       height = document.body.clientHeight; //IE
    }
    document.getElementById("QuartelCristao_Biblia_iframe").style.height = parseInt(height - document.getElementById("QuartelCristao_Biblia_iframe").offsetTop - 8) + "px";
}

window.onresize = QuartelCristao_Biblia_Resize_iframe;
 
(
function () {
   var url = "http://www.quartelcristao.com/js/biblia/style01/Default.aspx?";
    var current_location = window.location.hostname;
    url += "?" + "idb=" + quartelcristao_idb + "&idl=" + quartelcristao_idl;
    document.write("<iframe id='QuartelCristao_Biblia_iframe' width='" + quartelcristao_width + "' height='100%' frameborder=0 onLoad='QuartelCristao_Biblia_Resize_iframe()' src='" + url + "'></iframe>");
})()

Select all Open in new window