динамическая установка высоты iframe;не работает на то есть и хром - PullRequest
1 голос
/ 30 января 2012

Я пытаюсь установить высоту iframe динамически, используя javascript и Jquery.

Но по причине это не работает в Ie8 & chrome.(Но он отлично работает на Firefox)

Может ли какое-нибудь тело, пожалуйста, помочь?

Спасибо

 function resizePanel() {
         window.console.log("ran the resize panel function");
     var frame = document.getElementsByTagName('iframe')[0];
    if(frame != null) {

        var height;            
        if(self.innerHeight) {
            window.console.log("ran the self.innerHeight");
            height= self.innerHeight;                             
        }
        else if (document.documentElement && (document.documentElement.clientHeight)) {
           window.console.log("ran the clientHeight");
           height = document.documentElement.clientHeight;                           
         }
         else if(document.body) {
           window.console.log("ran the document.body");
           height = document.body.clientHeight;            
         }
         frame.style.height = height - 165 + 'px'         
    }};

    $(document).ready(function() {
        resizePanel();
        $(window).resize(function() {
            resizePanel();
        });
    });  

    var prm = Sys.WebForms.PageRequestManager.getInstance();
    prm.add_endRequest(EndRequest);

    function EndRequest(sender, args) {
        resizePanel();
    }

Ответы [ 2 ]

1 голос
/ 31 января 2012

Код прекрасно работает во всех браузерах, изменяя одну строку.

Вместо использования

var frame = document.getElementsByTagName('iframe')[0];

использовать

var frame = document.getElementById("ctl00_ctl00_ContentPlaceHolder1_Options_iframe");

Проблема была в том, что Chrome и IE скрыли iframes, и когда мы используем getElementsByTagName, он возвращает нам массив всех iframes. поэтому мы пытаемся получить доступ к индексу [0], он ссылался на какой-то другой iframe.

Надеюсь, это поможет.

Полный код:

 function resizePanel() {

         var frame = document.getElementById("ctl00_ctl00_ContentPlaceHolder1_Options_iframe");
    if(frame != null) {

        var height;            
        if(self.innerHeight) {

            height= self.innerHeight;                             
        }
        else if (document.documentElement && (document.documentElement.clientHeight)) {

           height = document.documentElement.clientHeight;                       
         }
         else if(document.body) {

           height = document.body.clientHeight;            
         }
         frame.style.height = height - 165 + 'px'

    }};

    $(document).ready(function() {
        resizePanel();
        $(window).resize(function() {
            resizePanel();
        });
    });  

    var prm = Sys.WebForms.PageRequestManager.getInstance();
    prm.add_endRequest(EndRequest);

    function EndRequest(sender, args) {
        resizePanel();
    }
1 голос
/ 30 января 2012

Ваш код кажется немного сложным, вы можете просто сделать следующее:

function resizePanel() {
    window.console.log("ran the resize panel function");
    var frame = document.getElementsByTagName('iframe')[0];
    if(frame != null) {
        frame.style.height = frame.contentWindow.document.body.scrollHeight + "px";
    }
}

Должно работать во всех основных браузерах.

Добро пожаловать на сайт PullRequest, где вы можете задавать вопросы и получать ответы от других членов сообщества.
...