kostyanet,
Написал так:
<!DOCTYPE html>
<html>
<head>
<script>
/* спинная часть */
var W=window,
D=W.document,
elem_rect={
left:function(elem){
var b = D.body,
e = D.documentElement,
x = W.pageXOffset || e.scrollLeft || b.scrollLeft,
c = e.clientLeft || b.clientLeft || 0;
return Math.round(elem.getBoundingClientRect().left+x-c);
},
top:function(elem){
var b = D.body,
e = D.documentElement,
y = W.pageYOffset || e.scrollTop || b.scrollTop,
c = e.clientTop || b.clientTop || 0;
return Math.round(elem.getBoundingClientRect().top+y-c);
}
};
/* головная часть
@param h html element the handle of the
@param div html element the draggable one
то есть за h мы будем таскать div,
все имена и совпадения случайные :)
*/
var dragElem=function(h,div){
var dx,dy,
mouseUp = function (){
W.removeEventListener('mousemove', divMove, true);
},
mouseDown=function (e){
dx=e.clientX-elem_rect.left(div);
dy=e.clientY-elem_rect.top(div);
W.addEventListener('mousemove', divMove, true);
},
divMove=function(e){
div.style.left = (e.clientX-dx) + 'px';
div.style.top = (e.clientY-dy) + 'px';
};
h.addEventListener('mousedown', mouseDown, false);
W.addEventListener('mouseup', mouseUp, false);
};
/* применение например */
dragElem(form.querySelector('h3'),form);
</script>
</head>
<body>
<div id="dragElem">
<div style="background: blue;width:100px;height:100px;"><h3>ffff</h3></div>
</div>
</body>
</html>
Но не работает, что то не так сделал?