这个功能主要是用了js的onmousedown、onmousemove、onmouseup、onmouseout几个事件。
并需要理解，FF和IE的offsetX、offsetY的差别。在FF下需要用layerX、layerY来代替offsetX、offsetY，
这两个事件属性是获得鼠标相对于父元素的相对位置。
注意：声明的DOCTYPE会影响document.documentElement.scrollTop和document.documentElement.scrollLeft的取值，
本人在网上找的解决方案如下：
关于js中 document.body.scrollTop 不能返回正确值的原因
本来是为了通过 document.body.scrollTop来获取浏览器垂直滚动条向下滚动的像素，但是不管滚动条在什么位置总是返回是0，
造成这样的原因和 html的头部声明有关，如果头部声明 为：
<!DOCTYPE HTML PUBLIC "-//W3C//DTD HTML 4.01 Transitional//EN" "http://www.w3.org/TR/html4/loose.dtd">，
这样肯定得到的结果是 0，如果该为<!DOCTYPE HTML PUBLIC "-//W3C//DTD HTML 4.01 Transitional//EN">
就能得到正确的结果，对于第一种头部声明想要得滚动条的滚动的高度怎么办，解决方法有两种
1、var scrollPos; if (typeof window.pageYOffset != 'undefined') {
scrollPos = window.pageYOffset; } else if (typeof document.compatMode != 'undefined' &&
document.compatMode != 'BackCompat') {
scrollPos = document.documentElement.scrollTop;
} else if (typeof document.body != 'undefined')
{
scrollPos = document.body.scrollTop;
}
2、用document.documentElement.scrollTop 替代 document.body.scrollTop
其中chrome游览器支持的是这种方式获得滚动的距离的
window.pageYOffset
那么把
var scrollX = document.documentElement.scrollLeft;
ar scrollY = document.documentElement.scrollTop;
改成下面这种，就支持这三种游览器了，呵呵！