比如现在一个页面上有左右两个部分组成，
我想有在鼠标按住一个地方拖动，
然后松开时候右边的窗口移动了鼠标移动的距离，
而左边的窗口缩小了相应的大小，
有谁做过呢，一般在框架中中用的比较多，请高手指点一下，很鼠标事件有关系，不知道怎么用，给个思路或者例子什么的都可以，继需，在线等！！
我想有在鼠标按住一个地方拖动，
然后松开时候右边的窗口移动了鼠标移动的距离，
而左边的窗口缩小了相应的大小，
有谁做过呢，一般在框架中中用的比较多，请高手指点一下，很鼠标事件有关系，不知道怎么用，给个思路或者例子什么的都可以，继需，在线等！！
可以用frameset，html中不是有个frame吗，它支持拖了的。
如果要得到当前鼠标的坐标，用event.clientX就x坐标。
这个event是鼠标事件中的鼠标参数，通过鼠标参数就可以获得鼠标拖动的坐标；event.clientX
参考：http://blog.csdn.net/IBM_hoojo/archive/2010/07/02/5708697.aspx
如果FRAMESET实在不能用，可以使用现成的UI库，如JQUERY UI，YUI等。不仅能实现这些功能，视觉效果也比你自己做得美观，重要的是，兼容性等一些问题也不用你管了。
楼上的那个是讲div的拖拽 用DIV也是可以实现frameset效果，但是很麻烦。。
即鼠标按下时记录鼠标的位置。放开时计算移动的距离。
然后改变 frameset的属性值
<!DOCTYPE HTML PUBLIC "-//W3C//DTD HTML 4.0 Transitional//EN">
<HTML>
<HEAD>
<TITLE> 窗体移动 </TITLE>
<style type="text/css">
A {
text-decoration:none;
}
</style>
<SCRIPT LANGUAGE="JavaScript">
<!--
//当前的宽度
var curLeft = 0;
//当前的高度
var curTop = 0;
//鼠标移动的X坐标
var curClientX = 0;
//鼠标移动的Y坐标
var curClientY = 0;
var curBool = false; //鼠标点击事件
function show() {
curLeft = document.getElementById("advShow").style.pixelLeft;
curTop = document.getElementById("advShow").style.pixelTop;
curClientX = event.clientX;
curClientY = event.clientY;
document.onmousemove = showDown;
curBool = true;
} //鼠标划过事件
function showDown() {
if (curBool) {
var curX = event.clientX; //鼠标划过的X轴坐标
var curY = event.clientY;//鼠标划过的Y轴坐标
document.getElementById("advShow").style.pixelLeft = curLeft + (curX - curClientX);
document.getElementById("advShow").style.pixelTop = curTop + (curY - curClientY);
}
} //当前div的高度
var curHeight = 0;
//当前div位置的高度
var highttTop = 0;
//当前的高度
var curHeightTop = 0;
//移动的步数
var start = 20; //窗体加载是初始化
function showHeight() {
curHeight = document.getElementById("advShow").offsetHeight;
highttTop = document.getElementById("advShow").style.pixelTop;
} //小化事件
function showMin() {
curHeightTop = document.getElementById("advShow").offsetHeight;
if (curHeightTop <= start) {
curHeightTop = start;
return;
} else {
curHeightTop = curHeightTop - start;
document.getElementById("advShow").style.height = curHeightTop + "px";
}
setTimeout("showMin()",100);
} //大化事件
function showMax() {
if (curHeightTop >= curHeight) {
curHeightTop = curHeight;
return;
} else {
curHeightTop = curHeightTop + start;
document.getElementById("advShow").style.height = curHeightTop + "px";
}
setTimeout("showMax()",100);
} //当前top位置
var topHeigth = 0;
//下框的top位置
var topId = 0;
//最大宽度
var curWidth = 0
//当前left位置
var curLeftWidth = 0;
//最小化事件
function showHeightMin() {
showMin();
topHeigth = document.getElementById("advShow").style.pixelTop;
curLeftWidth = document.getElementById("advShow").style.pixelLeft;
topId = document.getElementById("advId").style.pixelTop;
curWidth = document.body.offsetWidth - document.getElementById("advShow").offsetWidth;
if (curLeftWidth <= 0) {
curLeftWidth = 0;
}
if (topHeigth >= topId) {
topHeigth = topId;
return;
} else {
topHeigth = topHeigth + start;
document.getElementById("advShow").style.pixelTop = topHeigth;
}
setTimeout("showHeightMin()",100);
} //最大化事件
function showHeightMax() {
if (curLeftWidth >= curWidth) {
curLeftWidth = curWidth;
}
if (topHeigth <= highttTop) {
topHeigth = highttTop;
return;
} else {
topHeigth = topHeigth - start;
document.getElementById("advShow").style.pixelTop = topHeigth;
}
showMax();
setTimeout("showHeightMax()",100);
} //关闭事件
function showClose() {
document.getElementById("advShow").style.display = "none";
}
//-->
</SCRIPT>
</HEAD>
<BODY>
<div id="advShow" style="position:absolute;height:200px;width:200px;z-index:1;background-color:#0080FF;" onmouseup="curBool = false">
<div style="height:20px;width:200px;text-align:right;background-color:#FF80FF;cursor:hand;" onmousedown="show()">
<A href="javascript:showMin(),showHeight()">-</A>
<A href="javascript:showMax()">+</A>
<A href="javascript:showHeightMin(),showHeight()">最小化</A>
<A href="javascript:showHeightMax()">最大化</A>
<A href="javascript:showClose()">关闭</A>
</div>
</div>
<div id="advId" style="position:absolute;width:1190px;height:20px;top:580px;;background-color:#80FF80;"></div>
</BODY>
</HTML>
网上搜索一下，很好的实现楼主的效果