隐藏IFRAME的滚动条

jelly_x

浏览: 162413 次
性别:
来自: 成都

最近访客更多访客>>

limingnihao

冷月宫主

jklwan

lsj626472785

博主相关

博客

微博

相册

留言

关于我

文章分类

社区版块

存档分类

博客分类：

HTML

IE CSS JavaScript 浏览器 HTML

frame中隐藏横向滚动条

当main中的内容超过main的指定高度时，会同时出现竖向和横向滚动条，这是一种极不好的用户体验，理想状态应该是只出现竖向滚动条，我尝试了如下解决方法：

1.直接添加body属性<body style="overflow-x:hidden;">，结果是无效；

（分析原因：overflow-x是IE独有的 css 属性,加上DTD的话可能会被忽略,就像定制滚动条颜色的css属性一样）

2.去掉DOCTYPE声明<!DOCTYPE HTML PUBLIC "-//W3C//DTD HTML 4.01 Transitional//EN"

"http://www.w3.org/TR/html4/loose.dtd">以后，横向滚动条被限制了，目的虽然达到，但是假设采用div+css布局的话，去掉文档声明会引发更多的问题，所以还需要尝试一些其它的方式；

3.在使用iframe的情况下，可以不删除DOCTYPE声明，设置scrolling="yes",<body style="overflow-x:hidden;">也能生效。

00.让IFRAME的ScrollBar显示

<iframe   style   =   "overflow-x:scroll"   width="100px"   height="100px"></iframe>

overflow:auto   表示当内容的高度大于100px时，上下滚动条出现，宽度大于100px时，左右的出现 , 否则不出现。

overflow-x:scroll     表示无论如何左右滚动条都出现

overflow-y:scroll     表示无论如何上下滚动条都出现

注意这里面的高度，宽度必须设定，不然不会显示。

style="overflow-x:hidden"会隐藏

01.让背景图不滚动

IE浏览器支持一个 Body 属性 bgproperties，它可以让背景不滚动:

〈Body Background="图片文件" bgproperties="fixed"〉

05.进入页面后立即自动刷新？

＜meta http-equiv="refresh" content="120;url=http://www.wodutom.com/cn083"＞

http://www.wodutom.com/cn083,这是你自己的网址。

06.打开窗口即最大化

＜script language="JavaScript"＞

＜!-- Begin

self.moveTo(0,0)

self.resizeTo(screen.availWidth,screen.availHeight)

// End --＞

＜/script＞

07.能隐藏IFRAME的滚动条吗？我知道的三种方法:

1. 设置iframe scrolling="no"

2. 被包含页body应用overflow:hidden

3. 被包含页的body标签加scroll="no"

09.嵌入网页

＜iframe name="tt" src="01a.html" width="450" height="287" scrolling="Auto" frameborder="0"＞＜/iframe＞

10.跳转

＜meta http-equiv="refresh" content="3;URL=list.htm"＞

11.滚动

＜MARQUEE direction=up height=146 onmouseout=start() onmouseover=stop() scrollAmount=4＞＜/marquee＞

12.细线分隔线

＜hr noshade size=0 color=#C0C0C0＞

13.过度方式

＜meta http-equiv="Page-Exit" content="revealTrans(Duration=3,Transition=5)"＞

Duration的值为网页动态过渡的时间，单位为秒。

Transition是过渡方式，它的值为0到23，分别对应24种过渡方式。如下表：

0 盒状收缩； 1 盒状放射； 2 圆形收缩； 3 圆形放射； 4 由下往上； 5 由上往下； 6 从左至右； 7 从右至左；8 垂直百叶窗； 9 水平百叶窗； 10 水平格状百叶窗； 11垂直格状百叶窗； 12 随意溶解； 13从左右两端向中间展开； 14从中间向左右两端展开； 15从上下两端向中间展开； 16从中间向上下两端展开； 17 从右上角向左下角展开； 18 从右下角向左上角展开； 19 从左上角向右下角展开； 20 从左下角向右上角展开； 21 水平线状展开； 22 垂直线状展开； 23 随机产生一种过渡方式

21.添加到收藏夹：

〈a href="javascript:window.external.addFavorite('http://链接','说明');"〉添加到收藏夹〈/a〉

22.设为首页：

〈a href=# onclick=this.style.behavior='url(#default#homepage)';this.setHomePage('http://链接');〉设为首页〈/a〉

23.定制浏览器地址栏前的小图标：

在网页的〈head〉〈/head〉间加入以下语句：

〈link rel="shortcuticon" href="http://…/icon.ico"〉即可。其中 icon.ico 为 16x16 的图标文件，颜色不要超过 16 色。

本文来自CSDN博客，转载请标明出处：http://blog.csdn.net/yakihappy/archive/2009/03/11/3979162.aspx

分享到：