标签：
关于各类浮动的侧边栏小广告的实现.
纯css的方式实现:主要在于position属性中的fixed,固定侧边,在设置方位后,就能始终处于页面左侧或者右侧.这是最简便的实现方式.但是又一个兼容性的问题,就是在ie6下是无法设置的.所以需要一些额外
.fixed{
position:fixed;
clip:rect(0 100% 100% 0);
_position:absolute;
/* 底部 */
bottom:0px;
left:0px;
_top:expression(document.documentElement.scrollTop+document.documentElement.clientHeight-this.clientHeight);
/*_left:expression(document.documentElement.scrollLeft + document.documentElement.clientWidth - offsetWidth);*/
/* 左侧 */
/*left:0px;*/
/*_top:expression(document.documentElement.scrollTop+document.documentElement.clientHeight-this.clientHeight);*/
/*_left:expression(document.documentElement.scrollLeft + document.documentElement.clientWidth - offsetWidth);*/
}
/* 解决固定层在IE6下闪的问题 */
*html{
background-image:url(about:blank);
background-attachment:fixed;
}
具体位置可以进行改动.不过fixed的固定有一个不足之处,就是交互性很差,太过于死板,降低了用户对于网站的体验.
现在网上常见的浮动窗口,在用户下拉屏幕时,有个滑动的动作效果,显得不那么僵硬.对于此类实现主要是多添加一个一个定时器效果即可
setTimeout(function move(){
object.style.top=scrollTop+t+"px";//t为你需要他在屏幕中的位置,最好选择可见高度适配document.documentElement.clientHeight,这样可以时用户在拉伸页面时,窗口自动适配
},400);
ps:window.onresize=window.onload=window.onscroll
标签：
原文地址：http://www.cnblogs.com/lh0616/p/4977094.html
