jquery全屏显示iframe,缩放页面iframe高度自动变化

jquery全屏显示iframe,缩放页面iframe高度自动变化

复制代码
<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd">
<html xmlns="http://www.w3.org/1999/xhtml">
<head>
    <title>测试环境</title>
    <style type="text/css">
        *
        {
            margin: 0;
            padding: 0;
            list-style-type: none;
        }
    </style>
    <script type="text/javascript" src="https://cdn.bootcss.com/jquery/1.8.3/jquery.min.js"></script>
</head>
<body>
<script type="text/javascript">
    $(document).ready(function () {

        var iframeHeight = function () {
            var _height = $(window).height();
            $('#content').height(_height);
        }
        window.onresize = iframeHeight;
        $(function () {
            iframeHeight();
        });

    });

</script>

<div id="container" style="overflow:hidden;">
    <iframe border="0" id="content" src="http://www.qq.com/" frameborder="0" height="100%" width="100%"></iframe>
</div>
</body>
</html>
复制代码

 

posted @   WebApi  阅读(816)  评论(0编辑  收藏  举报
编辑推荐:
· .NET开发智能桌面机器人:用.NET IoT库编写驱动控制两个屏幕
· 用纯.NET开发并制作一个智能桌面机器人:从.NET IoT入门开始
· 一个超经典 WinForm,WPF 卡死问题的终极反思
· ASP.NET Core - 日志记录系统(二)
· .NET 依赖注入中的 Captive Dependency
阅读排行:
· 互联网不景气了那就玩玩嵌入式吧,用纯.NET开发并制作一个智能桌面机器人(二):用.NET IoT库
· 几个自学项目的通病,别因为它们浪费了时间!
· 在外漂泊的这几年总结和感悟,展望未来
· .NET 数据拷贝方案选择
· .net工作流elsa-书签
CopyRight © 博客园 WebAPI
点击右上角即可分享
微信分享提示