CSS实现将div固定在页面指定地方

    用一个div作为提示信息或者与用户交互的层控件，需要让它随着页面的滚动而固定在屏幕的某个地方。js可以实现这个功能，当页面滑动的时候，计算位置， 然后改变div的top属性即可。但是这样作出来的效果，恐怕没人会满意，因为抖的太厉害了，不能很及时的改变位置。

      要是能做到平滑的，一点都看不出来的技术来达到这种效果，恐怕只有css了。

 

 

<
html
>
<
head
>
    <
title
>
</
title
>
    <
style
 
type
=
"text/css"
>
       html,body {
            overflow:hidden;
            margin:0px;
            width:100%;
            height:100%;
        }

        .virtual_body {
            width:100%;
            height:100%;
            overflow-y:scroll;
            overflow-x:auto;
        }

        .fixed_div {
            position:absolute;
            z-index:2008;
            bottom:20px;
            left:40px;
            width:800px;
            height:40px;
            border:1px solid red;
            background:#e5e5e5;
        }
    </
style
>
</
head
>

<
body
>
<
div
 
class
=
"fixed_div"
>
I am still here!
</
div
>
<
div
 
class
=
"virtual_body"
>
    <
div
 
style
=
"height:1800px;"
>
        I am content !
    </
div
>
</
div
>
</
body
>
</
html
>

 

效果非常好，呵呵。