передвижение объекта в окне браузера

[ОлегА]

Чтобы разобраться в чем-то

согласен, но подключить jQuery это было лишь предложение, такое же как и посмотреть в учебнике!

[Nicki-rurg]

А можешь свой пример скинуть,посмотреть)

[ruslan_mart]

Вот мой рабочий вариант, проверял в опере и хроме. Думаю тебе придётся его доработать.

<div style="width:200px; height:500px; background:#000; position:fixed"><div onmousedown="Drag(this)" style="width:200px; height:50px; cursor:move; background:red"></div></div>

<script>
var DragZ = 100;

function Drag(a)
{
   var b = 1, c = a.parentNode.style, e = this, f = 1, g, h;
   DragZ++;
   c.zIndex = DragZ;
   a.onmousemove = function()
   {
      if(b)
      {
         if(f)
         {
            g = e.event.offsetX;
            h = e.event.offsetY;
            f = 0;
         }
         c.marginLeft = e.event.clientX-g;
         c.marginTop = e.event.clientY-h;
      }
   }
   window.onmouseup = function()
   {
      b = 0;
   }
}
</script>

[Nicki-rurg]

Спасибо)все классно)но все таки хотелось бы понять почему мой вариант не работает)

[JsLoveR]

Nicki-rurg, у вас в коде ошибка div.offsetleft, "Left" с маленькой буквы. Исправленный ваш код:

<div style="width:200px; height:200px; background:#345; position:absolute" onMouseDown="move(event, this)"></div>
<script language="javascript">
function move(e,div){
	document.onMouseDown = function(){return false}
	div.style.cursor = 'move';
	var x = e.pageX || e.clientX ;
	var y = e.pageY || e.clientY;
	var left = div.offsetLeft;
	var top = div.offsetTop;
	left = x - left;
	top = y - top;
	document.onmousemove = function(e){
		x = e.pageX || e.clientX;
		y = e.pageY || e.clientY;
		div.style.top = y - top+'px';
		div.style.left = x - left+'px';
	}
	document.onmouseup = function(){
		div.style.cursor = 'auto';
		document.onmousedown = function(){}
		document.onmousemove = function(){}
	}
}
</script>

[bushstas]

если я не ошибаюсь например в Опере не работает event.pageX
там event.clientX

if(e.pageX){x=e.pageX;y=e.pageY}
else if(e.clientX){x=e.clientX;y=e.clientY}

[JsLoveR]

bushstas, добавить var x = e.clientX || e.pageX. Добавил в код.