Home > Web Front-end > JS Tutorial > JQuery adaptive IFrame height (supports nesting and is compatible with IE, ff, safafi, chrome)_jquery

JQuery adaptive IFrame height (supports nesting and is compatible with IE, ff, safafi, chrome)_jquery

WBOY
Release: 2016-05-16 18:09:18
Original
1405 people have browsed it
Copy code The code is as follows:

function adjustIFramesHeightOnLoad(iframe) {
var iframeHeight = Math.min (iframe.contentWindow.window.document.documentElement.scrollHeight, iframe.contentWindow.window.document.body.scrollHeight);
$(iframe).height(iframeHeight);
}

I won’t talk about the failed test, let’s get straight to it.
Two links and iframe:
Copy code The code is as follows:

Personal Information
  • Modify password



  • js code:
    Copy code The code is as follows:



    The find("#content") here is to find the height of the id of content in the iframe content document (another example is find("body")), and set it to the iframe,
    Similarly, you can also set the width, leave it to friends who need it to try.
    This solves the problem that the iframe will not be blocked due to excessive content (because I set scrolling="no").
    PS: Basically, I will give priority to using iframe to achieve no refresh and be compatible with the browser's back button; and it is very cool to use iframe to load flash. There is no need to write any js calls or object tags, and it also complies with W3C standards.
    November 28, 2008 17:13:31, some improvements were made according to the actual situation during use today, the code is as follows:
    Copy code The code is as follows:



    I also found that using find("body") is not easy to use and is highly inaccurate.
    Related labels:
    source:php.cn
    Statement of this Website
    The content of this article is voluntarily contributed by netizens, and the copyright belongs to the original author. This site does not assume corresponding legal responsibility. If you find any content suspected of plagiarism or infringement, please contact admin@php.cn
    Popular Tutorials
    More>
    Latest Downloads
    More>
    Web Effects
    Website Source Code
    Website Materials
    Front End Template