ОсновноеRadiotalkПользовательское
Программирование
6   •   Посмотреть все темы

Перетаскивание картинки в DIV на JavaScript

 

6600
Александр @admiral
Сам код:
<script type="text/javascript">
var flag=false;
var shift_x;
var shift_y;

function start_drag(itemToMove,e){
if(!e) e = window.event;
flag=true;
shift_x = e.clientX-parseInt(itemToMove.style.left);
shift_y = e.clientY-parseInt(itemToMove.style.top);

if(e.stopPropagation) e.stopPropagation();
else e.cancelBubble = true;
if(e.preventDefault) e.preventDefault();
else e.returnValue = false;
}

function end_drag(){ flag=false; }

function dragIt(itemToMove,e){
if(!flag) return;
if(!e) e = window.event;
itemToMove.style.left = (e.clientX-shift_x) + "px";
itemToMove.style.top = (e.clientY-shift_y) + "px";

if(e.stopPropagation) e.stopPropagation();
else e.cancelBubble = true;
if(e.preventDefault) e.preventDefault();
else e.returnValue = false;
}
</script>

<div style="position:absolute; left:5px; top:5px;" onMouseDown="start_drag(this,event)" onMouseUp="end_drag()" onMouseMove="dragIt(this,event)">
<img src="ссылка на картинку">
</div>

Код вставляется между <body> и </body>, работа проверялась на браузерах IE6, Maxthon 2.1.5, Mozilla Firefox 3.0.5, Opera 9.62

Тут пример работы - _http://www.portal13.ru/lessons/ , открываем берем картинку и таскаем по экрану куда угодно )

6703
Андрей @ZloVeЩиЙ
Понял...Эхх... думаю нужный скрипт... Сам написал!?

6600
Александр @admiral
ZloVeЩиЙ пишет:

Понял...Эхх... думаю нужный скрипт... Сам написал!?

эм.. нет, не я, кое как нашел откуда когда-то брал такое решение, ссылка на оригинал - **********

6703
Андрей @ZloVeЩиЙ
Понятно, но все же за скрипт, и обьяснение спасибо!