iframe 在IE中布局变形

振乾 2014-10-11 03:00:47

iframe在iE中成了这个样子，
在chorme里面显示正常。

请各位大侠帮忙。

文件下载地址：
http://yunpan.cn/cgG4eNrR5qIYf （提取码：a3c4）

...全文

256 5 打赏收藏转发到动态举报

写回复

5 条回复

切换为时间正序

请发表友善的回复…

发表回复

振乾 2014-10-31

打赏
举报

回复

引用 4 楼 wz_307 的回复:

[quote=引用 3 楼 gguozhenqian 的回复:] [quote=引用 2 楼 wz_307 的回复:] js区不是发了贴吗这肯定是iframe中使用的路径出错了吧. 是不是使用了相对路径来进行的资源引用? 而且最好把网站部署出来, 用http协议来调试问题, 很多路径问题、浏览器限制、域问题都可以一目了然了

哥，我的代码已经贴出来了方便的话，你下载下来帮我看看。[/quote] 看了一下页面结构, 是一个object. 应该是不同浏览器对控件的解析不同. object上有个visible="false"的标签. 那么加个style="visibility:hidden;"可以藏起来[/quote] 兄弟，我试过了。还是不行噢。

wz_307 2014-10-13

打赏
举报

回复

js区不是发了贴吗这肯定是iframe中使用的路径出错了吧. 是不是使用了相对路径来进行的资源引用? 而且最好把网站部署出来, 用http协议来调试问题, 很多路径问题、浏览器限制、域问题都可以一目了然了

振乾 2014-10-13

打赏
举报

回复

求各位大鸟帮忙。

wz_307 2014-10-13

打赏
举报

回复

引用 3 楼 gguozhenqian 的回复:

[quote=引用 2 楼 wz_307 的回复:] js区不是发了贴吗这肯定是iframe中使用的路径出错了吧. 是不是使用了相对路径来进行的资源引用? 而且最好把网站部署出来, 用http协议来调试问题, 很多路径问题、浏览器限制、域问题都可以一目了然了

哥，我的代码已经贴出来了方便的话，你下载下来帮我看看。[/quote] 看了一下页面结构, 是一个object. 应该是不同浏览器对控件的解析不同. object上有个visible="false"的标签. 那么加个style="visibility:hidden;"可以藏起来

振乾 2014-10-13

打赏
举报

回复

引用 2 楼 wz_307 的回复:

js区不是发了贴吗这肯定是iframe中使用的路径出错了吧. 是不是使用了相对路径来进行的资源引用? 而且最好把网站部署出来, 用http协议来调试问题, 很多路径问题、浏览器限制、域问题都可以一目了然了

哥，我的代码已经贴出来了方便的话，你下载下来帮我看看。

[更新列表] ------------------------------------------------------------------------------------------------ v2.1.1 1、修复IE6静止定位的对话框导致页面变长的问题 v2.1.0 1、增加menuBtn参数, 支持让对话框在指定元素附近弹出(菜单模式) 2、剔除鸡肋参数'parent'，框架相互调用请用javascript原生方法 3、剔除对话框关闭后回调函数，如果需要使用请使用内置扩展方法 4、如果有取消按钮回调函数，那关闭按钮的回调函数也将与其相同 5、增加当出现多个对话框时让顶层的与众不同的特性 6、让Esc键关闭最高层对话框 7、锁屏的时候改用js屏蔽页面滚动功能，取消原来CSS隐藏滚动条，防止页面偏移 8、给确定按钮增加Ctrl + Enter快捷键，锁屏的时候支持tab与方向键切换按钮焦点 9、锁屏的时候屏蔽了键盘操作刷新、Tab切换(只在对话框中可用)与全选 10、修复Chrome特定情况下出现的iframe错位问题 11、修正2.0.8版本后锁屏不兼容Safari的问题 12、修复Firefox调大对话框拖帧的现象 13、修复拖动对话框时候可能因鼠标置入iframe窗口而导致鼠标被粘住的问题 14、修复了内部$.newId方法的一处错误，特定情况下导致定义了ID的对话框无法弹出 15、删除脚本对IE6 png bug内置支持，之前测试版本自动修复ie6 png皮肤是因为作者偷懒 16、修改aero皮肤CSS、针对IE6单独兼容，减少之前脚本修复png占用过多的客户端资源 17、默认皮肤改为前版的mini，没有使用任何背景图片，完全用css表现 18、修复一处隐秘BUG：当使用Ctrl+回车提交表单并弹出对话框时导致弹出新窗口 (因为此时焦点在对话框关闭链接上，这个快捷键让很多浏览器新建窗口) 19、重新绘制'earo'皮肤，修复毛边的问题 20、修复拖动的时候出现选中文本的现象(自动清除选择) 21、如果对话框高度超过浏览器视口的一半高度则不使用黄金比例垂直居中 22、修复了IE7通过url参数创建的iframe可能出现边框线的小问题 23、为了后续版能够提更多接口(小巧而强大的)，想了很久狠心改了调用名：art.dialog(); 24、既然连入口都改了，那再改下配置名(为了后续可能的拓展)： 'url'参数名改为'iframe' 25、可以自适应iframe内容的大小(不跨域的前提下) 26、对超过预设面积大小的对话框拖动自动采用替身的方式，以求拖动更流畅 27、新增加一个'data'的接口，它保存了你对话框每次创建的消息对象 (操作iframe消息将更加方便,如提交iframe表单。稍后添加更多的例子..) 28、对于简单的消息可以使用简写: artDialog('hello world') 29、让IE6支持覆盖下拉控件的同时也支持透明皮肤 30、优化锁屏渐变动画 31、修复范围限制函数没有生效的错误 32、修复一处笔误，忘记声明变量导致泄漏出去污染全局 v2.0.9 1、优化代码结构，弹出后仍可访问内部方法(如关闭)，大大增强了灵活性 2、修正IE7锁屏的时候滚动条没有禁止的问题 3、让焦点自动附加到确定按钮或者关闭按钮 v2.0.8 1、修正超大对话框并使用定位时候可能被截取的BUG 2、修复Opera无法正确处理对话框叠加高度(z-index)的BUG 3、修复Opera设置坐标时候出现的变形BUG v2.0.7 1、 url参数加载外部页面的时候显示loading动画 2、预加载皮肤背景图片 3、优化拖动 v2.0.6 1、解决页面载入即弹出的情况造成水平对齐不正常的BUG(主要是dom ready事件绑定) 2、增加parent参数，支持对话框穿越框架在父页面弹出 v2.0.5 1、剔除yesClose参数，如果要点击确定或者取消按钮不自动关闭对话框，让回调函数返回false即可 2、更改x参数名为left，y为top，为后续版本拓展right与bottom参数需要 3、修改皮肤aero和chrome的图标布局，让回行消息文本留出图标的宽度 v2.0.4 1、修改一小处兼容框架样式，防止调用页面body设置了文本对齐导致对话框标题文本也居中 v2.0.3 1、增加id参数，可以方便外部脚本控制整个对话框，同时可防止对话框重复弹出 2、增加yesClose参数，用于阻止对话框点击确定后自动关闭 v2.0.0 ...

一开始的需求只是表头部分在滚动时能一直固定在头部，那关键要实现的就是让tr能定位。首先想到的方法是给tr设置relative，用ie6/7测试以下代码： Code 1 2 3 4 给tr设置relative后就能相对table定位了，看来很简单啊，但问题是这个方法ie8和ff都无效，而且存在很多问题，所以很快就被抛弃了。 ps：该效果用来做tr的拖动会很方便。接着想到的是给table插入一个新tr，克隆原来的tr，并设置这个tr为fixed（ie6为absolute），例如： Code 1 2 3 4 5 6 第一个问题是fixed的tr在ie7中不能进行定位，而且td在定位后并不能保持在表格中的布局，这样在原表格插tr就没意义了。 ps：fixed的相关应用可参考仿LightBox效果。最后我用的方法是新建一个table，并把源tr克隆到新table中，然后通过对新table定位来实现效果。用这个方法关键有两点，首先要做一个仿真度尽可能高的tr，还有是要准确的定位，这些请看后面的程序说明。程序说明【克隆table】克隆一个元素用cloneNode就可以了，它有一个bool参数，表示克隆是否包含子节点。程序第一步就是克隆原table： this._oTable = $(table);//源table this._nTable = this._oTable.cloneNode(false);//新table this._nTable.id = "";//避免id冲突要注意虽然ie的cloneNode参数是可选的（默认是false），但在ff是必须的，建议使用时都写上参数。还要注意的是id属性也会被克隆，也就是克隆后会有两个相同id的元素（如果克隆对象有设置的话），这很容易会导致其他问题，程序会把克隆table的id属性设空。 ps：table请用class来绑定样式，用id的话新table就获取不了样式了。克隆之后再设置样式： this._style.width = this._oTable.offsetWidth + "px"; this._style.position = isIE6 ? "absolute" : "fixed"; this._style.zIndex = 100; 一般来说offsetWidth是width+padding+border的结果，但table比较特别，测试下面的代码： Code

iframe在iE中成了这个样子，在chorme里面显示正常。请各位大侠帮忙。文件下载地址：http://yunpan.cn/cgG4eNrR5qIYf (提取码：a3c4)回复讨论(解决方案)求各位大鸟帮忙。js区不是发了贴吗这肯定是iframe中使用的路径出错了吧. 是不是使用了相对路径来进行的资源引用?而且最好把网站部署出来, 用http协议来调试问题, 很多路径问题、浏览器限制、域问题都...

1、frame不能脱离frameSet单独使用，iframe可以；

2、frame不能放在body中；如下可以正常显示：

留下以后参考： 1、frame不能脱离frameSet单独使用，iframe可以； 2、frame不能放在body中；如下可以正常显示： --> --> 如下不能正常显示： 3、嵌套在frameSet中的iframe必需放在body中；如下可以正常显示：

61,112

社区成员

60,730

社区内容

发帖

与我相关

我的任务

社区管理员

加入社区

近7日
近30日
至今

加载中

查看更多榜单

社区公告

暂无公告

试试用AI创作助手写篇文章吧

+ 用AI写文章