关于侧边栏固定广告

关于各类浮动的侧边栏小广告的实现.

纯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