All geek questions in one place

Issue with resizing iframe jQuery in IE8

I use this piece of code to dynamically change an iframe (single domain) on a page:

function setHeight() {
        $("#myframe").height($("#myframe").contents().find("html").height());
    }

It works in Chrome, FF, and Safari, but not in IE8. Any ideas why this is not working?

Thank.

Edit: It should be mentioned that I am calling this function from the onload iframe event.

+3
source share
1 answer

I did it in jsfiddle.net, so here is the link if you want to check this: http://jsfiddle.net/4LQFc/5/

Here is a summary:

This is your HTML:

<!DOCTYPE html>
<html>
<body>
    <div id="div_loaded">loaded div</div>
    <p id="get_dimentions"></p>
    <iframe src="" id="iframetosize"></iframe>
</body>
</html>​

Some additional CSS ... for demo purposes:

p { 
          margin:10px;
          padding:5px;
          border:2px solid #666;
} 
#div_loaded { 
          position:relative;
          display:block;
          margin:10px;
          padding:5px;
          border:2px solid #666;
          height:30%; 
          width:30%;
} 
#iframetosize {
          margin:10px;
          padding:5px;
          background-color:#000; 
          color:#fff;
}​

This is jQuery (ugly but working):

var getsize = $("#div_loaded");
$("#get_dimentions").text( "Width: " + getsize.outerWidth() + " , Height: " + getsize.outerWidth(true) );
var sizewidth = getsize.outerWidth();
var sizeheight = getsize.outerHeight();
$("#iframetosize").css('height',sizeheight); 
$("#iframetosize").css('width',sizewidth);

, . ( ) ..css , . , CSS , outerWidth (true) vs().

0

Source: https://habr.com/ru/post/1787894/

More articles:


All Articles