YUI3 iframe高度自适应 

iframe.html

<!DOCTYPE html>
<html>
<head lang="en">
    <meta charset="UTF-8">
    <title></title>
</head>
<body>
<iframe id="frame1" src="iframe1.html" height="200px" frameborder="0" scrolling="no"></iframe>
<script src="http://yui.yahooapis.com/3.15.0/build/yui/yui-min.js"></script>
<script type="text/javascript">

    YUI.add('frame-modules', function(Y) {
        Y.frameOP = function(win, doc) {
            var h;
            YUI({win: win, doc: doc}).use('node', function(innerY) {
                var innerBody = innerY.one('body');
                h = innerY.one('body').getStyle('height');
            });

            return h;
        }
    }, '0.0.1', {requires: ['node', 'node-style']});

    YUI().use('frame-modules', function(Y) {

        var frame = document.getElementById('frame1'),
            win = frame.contentWindow,
            doc = frame.contentWindow.document;
        var h = Y.frameOP(win, doc);
        Y.log(h);
        Y.one('#frame1').set('height', h);
    });

</script>
</body>
</html>
iframe1.html

<!DOCTYPE html>
<html>
<head lang="en">
    <meta charset="UTF-8">
    <title></title>
</head>
<body>

<p>YUI3 was loaded!</p>
<p>YUI3 was loaded!</p>
<p>YUI3 was loaded!</p>
<p>YUI3 was loaded!</p>
<p>YUI3 was loaded!</p>
<p>YUI3 was loaded!</p>
<p>YUI3 was loaded!</p>
<p>YUI3 was loaded!</p>
<p>YUI3 was loaded!</p>
<p>YUI3 was loaded!</p>
<p>YUI3 was loaded!</p>
</body>
</html>

 

 

posted @ 2014-04-20 16:20  wheats  阅读(169)  评论(0)    收藏  举报