Published by

导读：
CSS部分：
*{
margin:0;
padding:0;
}
* html{
height:100%;
overflow-y:hidden;
}
* html body{
height:100%;
overflow-y:auto;
}
#TargetTOP{
position:fixed;
bottom:10px;
right:10px !important;
right:27px;
border:1px #f00 solid;
}
* html #TargetTOP{
position: absolute;
}
HTML部分：

＜ /div>

跳转到页面顶部＜ /div>
在FF,ie6,ie7下测试有效,现在发现的缺点是页面中不可以再出现其余带有position属性的元素了.
这些个代码没怎么用,难免有纰漏. 欢迎批评. 代码很简单就不加注释了.
拷贝代码注意下html中空格,实在抱歉,对付编辑器的时间太少.
6Responses to “不用JS的漂浮层”
1HedgerJan 24th, 2007 at 16:55
2承志Jan 24th, 2007 at 17:35
to Hedger,
It’s great! thank you^_^
3CatJan 24th, 2007 at 19:51
所谓浮动层就是指position:fixed的元素吧？position:fixed类似于position:absolute，不过元素是相对于浏览器内容区域定位，不受滚动影响，可惜IE6不支持。
其实只要在Google搜索”position:fixed IE”，就能找到一堆关于如何在IE里实现position:fixed的文章，用JavaScript的有，用CSS的也有，我个人更倾向于用CSS的――滚动时该元素相对静止，不会好像元素总是在根据滚动被动重定位，然后总是闪烁。
我觉得不错的一个方法就是手动分层，最低下一个层模拟浏览器的内容区域，通过overflow来让它可滚动。之后在此层外的position:absolute元素就相当于position:fixed了，而正常的文档流则放在此层内让它如平常那样可滚动。只要这个层本身定义了position:relative，它就会成为定位祖先，里面就可以正常使用position:absolute。
这个方法的唯一一个问题是，IE默认总是显示垂直滚动条（无需滚动时该滚动条disabled），内容层也出现滚动时右侧就有双滚动条。虽然可以通过noscroll属性关闭该滚动条，但又会让你的HTML不符合XHTML规范了；通过JavaScript关闭也可以，但又引入JavaScript了。
4guoshuangJan 25th, 2007 at 9:54
cat 说的是正解啊
5yangjindongMar 26th, 2007 at 13:17
正如文中最后所说的那样，其他对象再应用position属性的时候，就出现问题了！！

本文转自
http://www.uiplanet.com/taobao/2007/01/24/css_float_banner/