JavaScript not running in Script Editor

Question

I have a script editor web part on a page in my site. I have the following code in it:

<script src="https://ajax.googleapis.com/ajax/libs/jquery/1.12.2/jquery.min.js"></script>    
<script type="text/javascript">
    $( document ).ready(function() {
        document.getElementById("myframe").style.height=$('#myframe').contents().find('#divContent').clientHeight;
    });
</script>

Currently it is meant to change the height of an iFrame based on the size of the contents inside. It is currently not changing anything.

Why would this snippet not run when the page is loaded and set the size of the frame?

EDIT:

<iframe width='90%' src='//????.sharepoint.com/sites/test/AppBrightBanner/Pages/BannerAppPart.aspx?ASpeed=500&PauseTime=4000&Effect=random&NavThumbs=false&ThemeColor=rgb(0%2C%20114%2C%20198)&ThemeStyle=bar' 
frameborder='0' scrolling='no' seamless id="myframe"></iframe>

iFrame which is being used and when added to a content editor is being stuck at 150px in height, but when not in editor it is completly stripped and not viewable.

HTML from F12. Are these classed as outside the iframe?

Answer 1

I was able to address this by changing some of the initial script to firstly run when the frame has loaded.

<script type="text/javascript"> 
document.getElementById("myframe").onload = function()
{
    var x = document.getElementById("myframe");
    var height = height=document.body.clientHeight;
    document.getElementById("myframe").height = parseInt(height-document.getElementById("myframe").offsetTop-8)/1.9+"px";
}
</script>

I have learnt I cant dynamically set the height for my frame from the content inside because they are on different domains (sub domains count as seperate unfortunately).

Answer 2

There are few reason that might preventing your code to run

• Check jQuery reference added in your script editor.

• If you have added jQuery reference and still it is not working try your code by placing it in Content Editor WebPart.

If you still face issue then track console in debugger of browser. And let me know if solved you issue.

Thanks

Answer 3

You might be missing the jQuery reference on your page.

Also make sure the IDs of the content are correct.

Open the browser's console and check what exception you get. :)

EDIT:

As I understood, you are trying to resize the iframe to fit it's contents. The reason why your code doesn't work is taht #divContent is not actually on the page (it's in the iframe).

Tkae a look at this question and it's answers