IE6与IE7 8下iframe滚动条问题

最新推荐文章于 2022-11-28 08:01:49 发布
最新推荐文章于 2022-11-28 08:01:49 发布
阅读量3.3k 收藏
点赞数
文章标签： ie iframe html
版权声明：本文为博主原创文章，遵循 CC 4.0 BY-SA 版权协议，转载请附上原文出处链接和本声明。
本文链接：https://blog.csdn.net/CS_wuxiang/article/details/7477401
版权


   1、IE6 7 8 横竖滚条动不显显示采用<iframe scrolling="no"/>


   2、对于只显示横或竖滚动条：

        a.IE6只能控制html里的style.overfowX与overfowY="hidden"来调整,

        b.7 8 可以通过body一层来控制


代码：

JS:

   document.getElementById("aa").contentWindow.document.getElementsByTagName("html")[0].style.overflowX="hidden";

html:

iframeOverflow.html

<!DOCTYPE html PUBLIC "-//W3C//DTD HTML 4.01 Transitional//EN" "http://www.w3.org/TR/html4/loose.dtd">
<html>
<head>
<meta http-equiv="Content-Type" content="text/html; charset=UTF-8">
<title>Insert title here</title>
</head>
<body>
  <div>
<iframe id="aa" name="aa" src="iframeinner.html" > </iframe>
  </div>
</body>
</html>

iframeinner.html:

<!DOCTYPE html PUBLIC "-//W3C//DTD HTML 4.01 Transitional//EN" "http://www.w3.org/TR/html4/loose.dtd">
<html>
<head >
<meta http-equiv="Content-Type" content="text/html; charset=UTF-8">
<title>Insert title here</title>
</head>
<body  style="overflow:hidden;">
<div style="width:2000px;height:2000px;background:red;">asdfasdasdfasdfasdfasdfasdfasdfasdfasdfasdfasdfasdfasdfasdfasdfasdfasdfasdfasdfasdfasdfasdfasdfasdfasdfasdfasdfasdfasdfasdfasdfasdfasdfasdfasdfasdfasdfasdfasdfasdfasdfasdfasdfasdfasdfasdfasdfasdfasdfasdfasdfasdfasdfasdfasdfasdfasdff</div>
</body>
</html>



lowin
关注
  • 0
    点赞
  • 踩
  • 0
    收藏
    觉得还不错? 一键收藏
  • 0
    评论
浏览器兼容问题项目总结（六） 页面嵌套多个iframe滚动条兼容性修改
前端产品工程师
04-26 3318
最近几天一直在chrome和IE的兼容性问题上花费较多时间，将我在iframe这个问题上的一个坑给大家做个分享。 iframes 提供了一个简单的方式把一个网站的内容嵌入到另一个网站中。但我们需要慎重的使用iframe。iframe的创建比其它包括scripts和css的 DOM 元素的创建慢了 1-2 个数量级。使用 iframe 的页面一般不会包含太多 iframe，所以创建 DOM
iframe在IE6下出现横向滚动条的解决方案
09-22
最近的项目中，遇到ie6下当iframe出现纵向滚动条时同时会出现横向滚动条。分析了代码，大致的原因是iframe中的页面有相对body的样式包含width:100%的元素。
ie6下iframe出现水平滚动条的解决办法
Java企业应用
08-20 107
问题描述       页面A中通过IFRAME引入另一个页面B，并设置scrolling="auto"。当B页面的内容超过IFRAME的高度时，会自动出现滚动条；然而在IE6下，除了出现纵向滚动条外还会出现横向滚动条（即时设置了B页面的宽度为100%）。   注：问题只出现在IE6下，IE7,FIREFOX,CHROME下无此问题   问题原因       原因是IFRAME在加载页面...
完全搞定iframe（框架）里的滚动条！（一）
热门推荐
xpnew的技术blog
05-07 1万+
 完全搞定iframe（框架）里的滚动条！（一）说明：1、本文参考了网络上大量资料，本人在此深表感谢！2、本文假设读者，有一定的HTML、CSS、JS基础。3、本文讨论的目标是，通过A页面里的标记引用B网页之后，在A页面上出现滚动条这种情况的几种解决办法。4、因为篇幅的关系，文章被分成了两部分。通常情况下，（一）就能解决你的问题，（二）将会深入探讨这个问题和相关的解决方案。5、如果你觉得我啰嗦
关于iframe的页面加载出现滚动条的问题
分享日常bug
11-28 1428
【代码】关于iframe的页面加载出现滚动条的问题。
IE6去除iframe滚动条
UFO
08-23 546
在页面上引用frame或者iframe，在IE6浏览器下，可能出现横向滚动条，如果使用scroling="no"，会消除纵向的滚动条。 好，那也有可能在body标签或css里面定义overflow-x: hidden; overflow-y: auto;这两个参数，但是仍旧那讨厌的横向滚动条还在。     这是为什么呢？原来，在用IE6浏览有框架的XHTML页面的时候，默认会水平和垂直滚动条会
iframe 自适应高度[在IE6 IE7 FF下测试通过]
12-03
本文将详细介绍两种在IE6、IE7和Firefox下测试通过的`iframe`自适应高度的方法。 ### 第一种方法 这种方法使用JavaScript来动态调整`iframe`的高度。关键在于获取`iframe`内部文档的高度并将其设置为`iframe`的...
iframe自适应宽度、高度 ie6 7 8，firefox 3.86下测试通过
12-11
在本问题中，我们关注的是如何使`iframe`自适应其内容的宽度和高度，并确保在不同浏览器，如IE6、IE7、IE8以及Firefox 3.86下正常工作。 首先，代码中定义了一个变量`temp_iframe`，用于存储创建的`iframe`元素。...
Jquery iframe内部出滚动条
01-19
//ie7默认情况下会有上下滚动条，去掉上下15像素 var h = $(window).height() – rframe.offset().top – 15; rframe.height(h); } //注册加载事件 $(“#mainFrame”).load(pagestyle); //注册窗体改变大小事件 $...
XMLHTML 的 滚动条
weixin_30237281的博客
04-25 347
1.xhtml下滚动条的颜色问题？在原来的html的时候，我们可以这样定义整个页面的滚动条body{scrollbar-3dlight-color:#D4D0C8;/*-最外左-*/scrollbar-highlight-color:#fff;/*-左二-*/scrollbar-face-color:#E4E4E4;/*-面子-*/scrollbar-arrow-...
IE8 下 iframe 滚动条的问题
weixin_34090643的博客
07-30 240
//设置滚动条 $("iframe[name='updateFocalWork']").attr("scrolling", "yes").css("overflow-y", "auto").css("overflow-x", "hidden"); 无法将默认scrolling为no 的iframe修改属性,导致无法显示滚动条. 转载于:https://www.cnb...
HTML IE iframe 始终显示垂直滚动条
weixin_30278311的博客
09-15 200
注意： IFrame在Firefox，google 浏览器中，只要overflow-x:hidden;overflow-y:scroll就可以解决 但是在IE内，XP和W98等版本中，不同版本浏览器下会出现一些差异，无法实现始终显示一个垂直或水平的滚动条 总之IE内，IFrame往往是要么横纵滚动条一起显示，要么全部不显示，没有其他的选择 解决方案： 可以通过IFrame内部嵌套div的...
iframe框架套iframe页面滚动条的问题，一切没问题，就差在FF个IE7上测试了~
luzuocheng_1503的专栏
09-12 1759
http://www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd">http://www.w3.org/1999/xhtml">无标题文档body { margin-left: 0px; margin-top: 0px; margin-right: 0px; margin-bottom: 0px; background-color: #33CCFF;}
小技巧：去掉iframe多余的空白和滚动条
系统运维
03-22 402
&lt;html&gt; &lt;head&gt; &lt;style&gt; *{margin:0;padding:0} &lt;/style&gt; &lt;/head&gt; &lt;body style="overflow-y:hidden;height:100%"&gt; &lt;iframe src="http://IP:8090/" frame
IE6与IE7,8下ifame中用JS控制滚动条的问题
CS_wuxiang的专栏
06-28 776
1、IE6 7 8 横竖滚条动不显显示采用    2、对于只显示横或竖滚动条：         a.IE6只能控制html里的style.overfowX与overfowY="hidden"来调整,         b.7 8 可以通过body一层来控制
iframe 隐藏滚动条
最新发布
06-26
`<iframe>` 标签在 HTML 中用于嵌入另一个 HTML 文档或资源（如网页、SVG 或 PDF），默认情况下，它会显示自己的滚动条，以便用户能够浏览嵌入的内容。如果你希望隐藏`iframe`的滚动条，你可以使用 CSS 来控制其样式。以下是如何隐藏`iframe`滚动条的方法： 1. 使用 CSS `overflow` 属性： ```html <iframe style="overflow: hidden;" src="your-iframe-url"></iframe> ``` 这将会隐藏`iframe`内部的任何滚动行为。 2. 对`iframe`元素应用一个包含`::-webkit-scrollbar`和`::-webkit-scrollbar-track`的样式，以覆盖浏览器默认的滚动条样式（适用于WebKit内核的浏览器，如Chrome和Safari）： ```html <iframe style="width: 100%; height: 100%; overflow-y: auto; scrollbar-width: none; -ms-overflow-style: none; /* For IE/Edge */ -webkit-scrollbar: none;">...</iframe> ``` 这里使用了`scrollbar-webkit-scrollbar: none`来隐藏滚动条，`overflow-y: auto`让内容可以垂直滚动。 请注意，不同浏览器对CSS滚动条处理可能略有差异，上述方法可能不适用于所有情况。如果你希望兼容性更好，可以考虑使用JavaScript库，如`hide-scrollbar`或`perfect-scrollbar`。
评论
添加红包

请填写红包祝福语或标题

个

红包个数最小为10个

元

红包金额最低5元

当前余额3.43元 前往充值 >
需支付：10.00元
成就一亿技术人!
领取后你会自动成为博主和红包主的粉丝 规则
hope_wisdom
发出的红包
实付元
使用余额支付
点击重新获取
扫码支付
钱包余额 0

抵扣说明：

1.余额是钱包充值的虚拟货币，按照1:1的比例进行支付金额的抵扣。
2.余额无法直接购买下载，可以购买VIP、付费专栏及课程。

余额充值