仓酷云

 找回密码
 立即注册
搜索
热搜: 活动 交友 discuz
查看: 762|回复: 7
打印 上一主题 下一主题

[DIV+CSS] 来讲讲:IE6不兼容position:fixed属性的办理举措

[复制链接]
飘灵儿 该用户已被删除
跳转到指定楼层
楼主
发表于 2015-1-15 23:10:09 | 只看该作者 回帖奖励 |倒序浏览 |阅读模式

马上注册,结交更多好友,享用更多功能,让你轻松玩转社区。

您需要 登录 才可以下载或查看,没有帐号?立即注册

x
学习这篇入门教程之前,请确定你已经具有了一定的HTML基础。
网页制造Webjx文章简介:IE6下不兼容position:fixed属性!在网上也看了一些材料仍是不可!
IE6下不兼容position:fixed属性!在网上也看了一些材料仍是不可!
position:fixed;这个属性用起来的确很便利,能够轻松的完成流动地位的浮动层效果。可是,它不撑持IE6及以下版本。因而良多同砚利用JS摹拟。明天写了一个DEMO,触及左边、右边。及高低双方,共四种地位的流动,与以往的教程分歧的中央是,它利用CSS表达式来兼容IE5、IE6,且制止了js摹拟时,拖动转动条时呈现发抖的成绩,别的在IE5大概怪癖形式下也完整一般,没有任何成绩。假如你有更好的计划,接待来喷我。
上面是代码
<!DOCTYPEHTML>
<html>
<head>
<metacharset="utf-8">
<title>position:fixed——webjx.com</title>
<styletype="text/css">
*{
padding:0;
margin:0;
}
#content{
height:5000px;
width:50%;
border-right:10pxdottedred;
}
#demo_t,#demo_b,#demo_l,#demo_r{
background:#f90;
position:fixed;
}
#demo_t,#demo_b{
left:0;
width:100%;
}
#demo_l,#demo_r{
width:50px;
top:300px;
}
#demo_t{
top:0;
}
#demo_b{
bottom:0;
}
#demo_l{
left:0;
}
#demo_r{
right:0;
}
</style>
<!--[iflteIE6]>
<styletype="text/css">
html{
/*这个可让IE6下转动时无发抖*/
background:url(about:black)no-repeatfixed
}
#demo_t,#demo_b,#demo_l,#demo_r{
position:absolute;
}
#demo_t,#demo_b{
/*这个办理body有padding时,IE6下100%不克不及展满的成绩*/
width:expression(offsetParent.clientWidth);
}
/*上面三组划定规矩用于IE6下top盘算*/
#demo_l,#demo_r{
top:expression(offsetParent.scrollTop+300);
}
#demo_t{
top:expression(offsetParent.scrollTop);
}
#demo_b{
top:expression(offsetParent.scrollTop+offsetParent.clientHeight-offsetHeight);
}
</style>
<![endif]-->
</head>
<body>
<divid="demo_t">此处显现id"demo"的内容</div>
<divid="demo_b">此处显现id"demo"的内容</div>
<divid="demo_l">此处显现id"demo"的内容</div>
<divid="demo_r">此处显现id"demo"的内容</div>
<divid="content"></div>
</body>
</html>
倡议在实践利用时,将IE前提正文中的代码放在独自的css文件中,以便勤俭其他扫瞄器的流量。

特地顶一下微软的这个项目,如今有中文版了,倡议宽大前端er到场这一行列,尽快死亡IE6
</p>
更好的控制页面布局。不用多说。
莫相离 该用户已被删除
沙发
发表于 2015-1-17 20:08:54 | 只看该作者
Dreamweaver由MX版本开始使用Opera软件公司的排版引擎“Presto”作为网页预览。
飘灵儿 该用户已被删除
板凳
 楼主| 发表于 2015-1-26 22:40:25 | 只看该作者
Dreamweaver8中文版(dw)是由Macromedia公司开发的一款所见即所得的网页编辑器。和二维动画设计软件FLASH,专业网页图像设计软件FIREWORKS,并称为“网页三剑客”。
深爱那片海 该用户已被删除
地板
发表于 2015-2-11 07:29:20 | 只看该作者
Dreamweaver是唯一提供Roundtrip HTML、视觉化编辑与原始码编辑同步的设计工具。它包含HomeSite和BBEdit等主流文字编辑器。
admin 该用户已被删除
5#
发表于 2015-3-2 00:47:19 | 只看该作者
技术的学习如同长跑。只要越过极限,就会越跑越轻松。技术的学习其实并不像想象中那么可怕,任何技术都并不高深莫测。
海妖 该用户已被删除
6#
发表于 2015-3-11 03:53:28 | 只看该作者
所见则所得网页编辑器的优点就是直观性,使用方便,容易上手.
只想知道 该用户已被删除
7#
发表于 2015-3-17 22:08:23 | 只看该作者
帧(frames)和表格的制作速度快的令您无法想像。进阶表格编辑功能使您简单的选择单格、行、栏或作未连续之选取。
再现理想 该用户已被删除
8#
发表于 2015-3-25 08:00:29 | 只看该作者
由CS4 版本开始,则转用WebKit 排版引擎(亦即Google Chrome和Apple Safari浏览器所用的排版引擎)作为网页预览。
您需要登录后才可以回帖 登录 | 立即注册

本版积分规则

QQ|Archiver|手机版|仓酷云 鄂ICP备14007578号-2

GMT+8, 2024-4-20 04:01

Powered by Discuz! X3.2

© 2001-2013 Comsenz Inc.

快速回复 返回顶部 返回列表