Page drops down to iframe when loading

I installed an iframe to this website and originally had issues with it not displaying the full content, so I added some javascript. Now I'm having issues with the page dropping down to the iframe upon loading instead of letting the viewer scroll down to it.  Help! 

This is the code I am starting with: 

<style>
    .styled-iframe {
        width: 100%;
        border: 2px solid #000; /* Add a border */
        border-radius: 10px; /* Make the border corners rounded */
        box-shadow: 5px 5px 15px rgba(0,0,0,0.3); /* Add a shadow */
    }
</style>

<iframe id="myIframe" class="styled-iframe" src="https://matrix.canopymls.com/Matrix/public/IDX.aspx?idx=f4033431" frameborder="0" marginwidth="0" marginheight="0"></iframe>

<script>
    function setIframeHeight() {
        var iframe = document.getElementById('myIframe');
        iframe.style.height = window.innerHeight + 'px';
    }

    window.onload = setIframeHeight;
    window.onresize = setIframeHeight;
</script>