[建站综合技术] iframe以全屏的方式引入一个页面

[复制链接]
查看: 581|回复: 0

10

主题

10

帖子

38

积分

新手上路

Rank: 1

积分
38
发表于 2019-5-27 21:51:26 | 显示全部楼层 |阅读模式
大家知道使用iframe可以引入一个页面,但是在默认状态下,iframe的宽度并不是全屏状态的。这样的话,可能会严重影响我们的预览效果,下面就分享一段代码实例,它实现了全屏引入页面你的效果。
代码实例如下:
  1. <!DOCTYPE html>
  2. <html>
  3. <head>
  4. <meta charset="utf-8">
  5. <meta name="author" content="http://www.zuntop.com/" />
  6. <title>尊托云数</title>
  7. <style>
  8. body{
  9.   margin:0;
  10.   padding:0;
  11.   overflow-y:hidden
  12. }
  13. </style>
  14. <script src="http://libs.baidu.com/jquery/1.9.0/jquery.js"></script>
  15. <script type="text/javascript">
  16. window.onerror=function(){return true;}
  17. $(function(){
  18.   headerH = 0;  
  19.   var h=$(window).height();
  20.   $("#iframe").height((h-headerH)+"px");
  21. });
  22. </script>
  23. </head>
  24. <body>
  25. <iframe id="iframe" frameborder="0" src="http://www.zuntop.com" style="width:100%;"></iframe>
  26. </body>
  27. </html>
复制代码


腾讯云
您需要登录后才可以回帖 登录 | 立即注册

本版积分规则

精彩图文



在线客服(工作时间:9:00-22:00)
400-600-6565

内容导航

微信客服

Copyright   ©2015-2019  云服务器社区  Powered by©Discuz!  技术支持:尊托网络     ( 湘ICP备15009499号-1 )