怎样让图片绝对定位，且随屏幕浮动

Question

简而言之，我想做的效果就是：不管滚动条怎样拉伸，背景固定不变，请教怎样实现？下面说的没啥实际作用，可以不看说明：手机上的widget
想做到一个效果就是有一个背景，其大小能随手机分辨率不同而调整，原先用background-image做发现背景图片的大小不能变。
后来上网找到了可以用div做，把DIV放在最底层的方法（<div style="position:absolute; width:640px; height:360px; z-index:-1">这里是背景</div>>），试过了，可行，不过有一个问题就是当页面内容比较多，其高度大于手机屏幕高度的时候，往下拉则背景div跟着走，而不能随屏幕下拉而变化，可能描述的不是很明白，大概是这意思了，

Answer 1

给你一个例子：
var width = document.body.clientWidth;
        var height = document.body.clientHeight;        var divWidth = 200;
        var divHeight = 100;
        var div = document.createElement("div");
        div.setAttribute("id", "ShowDiv");
        div.style.zIndex = 99;
        div.style.width = divWidth + "px";
        div.style.height = divHeight+"px";
        div.style.position = "absolute";
        div.style.backgroundColor = "Red";
        div.innerHTML = "HELLO";
               div.style.top = (height - divHeight) + "px";
       div.style.left = (width - divWidth) + "px";
       document.body.appendChild(div);       window.onresize = function() {
           width = document.body.clientWidth;
           height = document.body.clientHeight;
           var showDiv = document.getElementById("ShowDiv");
           showDiv.style.top = height - divHeight + "px";
           showDiv.style.left = width - divWidth + "px";
       }
       window.onscroll = function() {
       width = document.body.clientWidth;
       height = document.body.clientHeight;
       var showDiv = document.getElementById("ShowDiv");
       showDiv.style.top = height - divHeight + document.body.scrollTop + "px";
       showDiv.style.left = width - divWidth +document.body.scrollLeft+ "px";
       }这个是div显示在游览器的右下方。并随滚动条上下左右移动。
如果document.body.srollTop没有反应，就用document.documentElement代替document.body

Answer 2

不能随屏幕下拉而变化
肯定是你没有设置DIV的宽度和高度随着变化的代码啊！！！
难道DIV 自己能自己知道啊

Answer 3

CSS中有背景固定background-attachment : scroll | fixed 取值：
scroll  :　 默认值。背景图像是随对象内容滚动 
fixed  :　 背景图像固定