Html中 IFrame的用法及注意点

 更新时间:2016年12月22日 15:44:07   作者:Supper_litt  
这篇文章主要介绍了Html IFrame的用法及注意点,非常不错,具有参考借鉴价值,需要的朋友可以参考下

0x01 iframe的跳出框架

0x02 iframe样式设置

0x03 iframe重置高度

1、首先来一个,跳出iframe的好方法,直接可以在Login.aspx页面使用。

if (window.parent.[IFRAME外壳的某方法]) {
 top.location.href = "Login.aspx";
}

2、再来段比较好看的iframe

<script type="text/javascript">
 function SetWinHeight() {
  var obj = document.getElementById("content");
  var win = obj;
  if (win && !window.opera) {
   if (win.contentDocument && win.contentDocument.body.offsetHeight)
    win.height = win.contentDocument.body.offsetHeight + 20;
   else if (win.Document && win.Document.body.scrollHeight)
    win.height = win.Document.body.scrollHeight + 20;
  }
 }
 window.onresize = function () {
  SetWinHeight();
 }
</script>
<div class="page-body">
 <iframe id="content" src="None.aspx" name="content" onload="javascript:SetWinHeight()" frameborder="0"
  scrolling="auto" style="min-height: 700px;" height="100%" width="100%"></iframe>
</div>

3、子页面的使用,子页面,在调整大小后,可以调用父页面的SetWinHeight就可用把布局弄好看了。

if (window.parent.SetWinHeight)
  window.parent.SetWinHeight();

以上所述是小编给大家介绍的Html之 IFrame使用及注意点,希望对大家有所帮助,如果大家有任何疑问请给我留言,小编会及时回复大家的。在此也非常感谢大家对脚本之家网站的支持!

相关文章

  • uniapp分包(小程序分包)处理图文详解

    uniapp分包(小程序分包)处理图文详解

    小程序上传的时候,主包不能超过2M,如果超出,则会上传失败,这时候就需要把界面进行分包,下面这篇文章主要给大家介绍了关于uniapp分包(小程序分包)处理的相关资料,需要的朋友可以参考下
    2023-01-01
  • JavaScript面向对象编写购物车功能

    JavaScript面向对象编写购物车功能

    这篇文章主要为大家详细介绍了JavaScript面向对象编写购物车功能的相关资料,具有一定的参考价值,感兴趣的小伙伴们可以参考一下
    2016-08-08
  • JavaScript位置参数实现原理及过程解析

    JavaScript位置参数实现原理及过程解析

    这篇文章主要介绍了JavaScript位置参数实现原理及过程解析,文中通过示例代码介绍的非常详细,对大家的学习或者工作具有一定的参考学习价值,需要的朋友可以参考下
    2020-09-09
  • js 如何实现对数据库的增删改查

    js 如何实现对数据库的增删改查

    JavaScript操作数据库JS操作Access数据库,跟其他语言操作差不多,总结了一下习惯代码,需要的朋友可以参考下
    2012-11-11
  • 一文带你掌握JavaScript中的EventLoop机制

    一文带你掌握JavaScript中的EventLoop机制

    JavaScript是 单线程、非阻塞 的,它通过事件队列 (Event Loop) 的方式来实现异步回调,所以本文小编就带大家来深入了解一下JavaScript中的EventLoop机制,需要的可以了解下
    2024-02-02
  • javascript模拟枚举的简单实例

    javascript模拟枚举的简单实例

    本篇文章主要是对javascript模拟枚举的简单实例进行了介绍,需要的朋友可以过来参考下,希望对大家有所帮助
    2014-03-03
  • javascript中layim之查找好友查找群组

    javascript中layim之查找好友查找群组

    这篇文章主要介绍了javascript中layim之查找好友查找群组,本文给大家介绍的非常详细,对大家的学习或工作具有一定的参考借鉴价值,需要的朋友可以参考下
    2021-02-02
  • 使用js完成节点的增删改复制等的操作

    使用js完成节点的增删改复制等的操作

    本文为大家详细介绍下使用js完成节点的增删改复制等的操作,具体的实现如下,感兴趣的朋友可以参考下
    2014-01-01
  • 通过BootStrap实现轮播图的实际应用

    通过BootStrap实现轮播图的实际应用

    js我们没有学过,今天我是用bootstrap实现轮播图的效果,非常不错代码简单易懂,需要的朋友参考下吧
    2016-09-09
  • 关于JSON与JSONP简单总结

    关于JSON与JSONP简单总结

    JSON(JavaScript Object Notation) 是一种轻量级的数据交换格式。而JSONP(JSON with Padding)是资料格式 JSON 的一种“使用模式”。下面是小编总结的关于JSON与JSONP知识,感兴趣的朋友一起看下吧
    2016-08-08

最新评论