浅析IE10兼容性问题(frameset的cols属性)

最近需求涉及浏览器的兼容性，首先处理的是ie10。

主页用 frameset 嵌了两个页面，左侧为菜单栏，可以通过改变 frameset 的 cols 来收缩。别的浏览器正常，但 IE10 却没任何的反应。


代码如下:

function hide_show(){
if(window.parent.outer_frame.cols=="0,10,*"){
frameshow.src="<%=request.getContextPath()%>/common/images/left_handle.gif";
div_hide_show.title="隐藏"
window.parent.outer_frame.cols = "210,10,*";
}else{
frameshow.src="<%=request.getContextPath()%>/common/images/right_handle.gif";
div_hide_show.title="显示"
window.parent.outer_frame.cols = "0,10,*";
}
}

设置cols无效果，设置rows可以，这个是由于IE10的BUG问题，需要调整页面大小才会生效：


代码如下:

function hide_show(){
if(window.parent.outer_frame.cols=="0,10,*"){
frameshow.src="<%=request.getContextPath()%>/common/images/left_handle.gif";
div_hide_show.title="隐藏"
window.parent.outer_frame.cols = "210,10,*";
}else{
frameshow.src="<%=request.getContextPath()%>/common/images/right_handle.gif";
div_hide_show.title="显示"
window.parent.outer_frame.cols = "0,10,*";
}

/*force ie10 redraw*/
if(navigator.userAgent.indexOf('MSIE 10.0') != -1){
var w = parent.document.body.clientWidth;
parent.document.body.style.width = w + 1 + 'px';
setTimeout(function(){
parent.document.body.style.width = w - 1 + 'px';
parent.document.body.style.width = 'auto';
}, 0);
}
}

赞 (0)

相关推荐

  • 浅析IE10兼容性问题(frameset的cols属性)

    最近需求涉及浏览器的兼容性,首先处理的是ie10. 主页用 frameset 嵌了两个页面,左侧为菜单栏,可以通过改变 frameset 的 cols 来收缩.别的浏览器正常,但 IE10 却没任何的反应. 复制代码 代码如下: function hide_show(){if(window.parent.outer_frame.cols=="0,10,*"){frameshow.src="<%=request.getContextPath()%>/common/i

  • 浅析vue3响应式数据与watch属性

    是Vue3的 composition API中2个最重要的响应式API ref用来处理基本类型数据, reactive用来处理对象(递归深度响应式) 如果用ref对象/数组, 内部会自动将对象/数组转换为reactive的代理对象 ref内部: 通过给value属性添加getter/setter来实现对数据的劫持 reactive内部: 通过使用Proxy来实现对对象内部所有数据的劫持, 并通过Reflect操作对象内部数据 ref的数据操作: 在js中要.value, 在模板中不需要(内部解析

  • js控制frameSet示例

    1:js修改frameset的cols属性来达到修改各个页面所占的宽高,例如隐藏当前frame页. 复制代码 代码如下: window.parent.document.getElementsByTagName("frameset")[0].cols="0,*"; 2:js调用其他frame页面的函数.例如 复制代码 代码如下: parent.subMainFrame.show();

  • 对layui数据表格动态cols(字段)动态变化详解

    如搜索查询时,常会遇到按日期时间段查询,并显示查询的每个日期的数据,后台拼装数据此处不讨论. 把表格渲染封装在函数里面,cols_arr是传入的字段数组 function tableRender(cols_arr){ table.render({ elem: '#demo' , url: 请求地址 //数据接口 , method: 'post' , page: true //开启分页 , cols: cols_arr , id: 'demo' , limit: 10 , limits: [10,

  • html的基本使用（HTML标签解释）

    一.链接在HTML中超文本的链接非常重要,基本格式如下:<A HREF="资源地址">链接文字</A> 1.本地链接①绝对路劲:<A HREF="C:\images\article.jpg">绝对路劲链接到本地图片</A>②相对路劲<A HREF ="article2.jpg"> 相对路劲链接到本地图片</A>③链接到上一级目录<A HREF="../test

  • HTML 30分钟入门教程

    运行下面的代码就可以了 HTML 30分钟入门教程 h1 {text-align:center} p {text-indent:2em; line-height:140%; margin:auto 10px} span {margin:3px} .code { border:solid 1px gray; background-color:#eee} .name { font-weight:bold } dl {margin-left:20px} dt {font-weight:bold} .t

  • 如何用js控制frame的隐藏或显示的解决办法

    index.htm 复制代码 代码如下: <html><head><meta HTTP-EQUIV="Content-Type" CONTENT="text/html; charset=gb2312"><meta name="GENERATOR" content="Microsoft FrontPage 4.0"><meta name="ProgId"

  • PHP实现简单聊天室(附源码)第1/2页

    一,聊天室模块实现1,聊天室主页面窗口设置 复制代码 代码如下: <meta http-equiv="Content-Type" content="text/html; charset=gb2312" /><!--载入配置文件--><?php include_once 'config.php';?><!--页面标题--><title><?php echo CHAT_NAME; ?></ti

  • 整理关于Bootstrap表单的慕课笔记

    整理关于Bootstrap表单的慕课笔记

    整理自慕课笔记 基础表单 表单主要功能是用来与用户做交流的一个网页控件,良好的表单设计能够让网页与用户更好的沟通.表单中常见的元素主要包括:文本输入框.下拉选择框.单选按钮.复选按钮.文本域和按钮等.其中每个控件所起的作用都各不相同,而且不同的浏览器对表单控件渲染的风格都各有不同. 对于基础表单,Bootstrap并未对其做太多的定制性效果设计,仅仅对表单内的fieldset.legend.label标签进行了定制.主要将这些元素的margin.padding和border等进行了细化设置. 当

  • Bootstrap源码解读表单（2）

    源码解读Bootstrap表单 基础表单 对于基础表单,Bootstrap并未对其做太多的定制性效果设计,仅仅对表单内的fieldset.legend.label标签进行了定制.主要将这些元素的margin.padding和border等进行了细化设置. 这些元素如果使用了类名"form-control",将会实现一些设计上的定制效果. 1. 宽度变成了100% 2. 设置了一个浅灰色(#ccc)的边框 3. 具有4px的圆角 4. 设置阴影效果,并且元素得到焦点之时,阴影和边框效果会

随机推荐