浅析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);

  }

  }