[ Поиск ] - [ Пользователи ] - [ Календарь ]
Полная Версия: Drag'n'Drop
Timok
Как реализовать в JS перетаскивание элементов (любых, а не только изображений) по странице? Киньте ссылку на пример, а то куда не ткнись - везде перетаскивание картинок. Да кроссбраузерного скрипта нигде не встречал... Это реально вообще?



Спустя 9 минут, 27 секунд (1.03.2007 - 18:18) md5 написал(а):
а тут на форуме, возле профиля есть "Помощник" ;)
протесть во всех браузерах, если оно - дерни =)

Спустя 13 минут, 28 секунд (1.03.2007 - 18:32) vasa_c написал(а):

Спустя 14 минут, 31 секунда (1.03.2007 - 18:46) Timok написал(а):
ok спасибо :)
щас посмотрю....

Спустя 18 минут, 29 секунд (1.03.2007 - 19:05) AlexBB написал(а):
Сильно не пинайте ... писал давным давно - лет семь назад, под IE и Мозилой проверил, работает вроде.
Таскается слой за часть его области - типа имитация шапки окна.
Возможно поможет.
В идеале надо, конечно, переделать на объектную модель, чтоб таких окон можно было много поррождать и они не конфликтовали.

<div id="WIND" style="position:absolute; width:200; height:200; left:120; top:120; border : solid 1px red">
Тест
</div>

<script language="JavaScript1.2">
// Зона за которую можно таскать
var x = 0;
var y = 0;
var w = 100;
var h = 100;

document.onmousemove = MouseEvent;
document.onmousedown = MousePress;
document.onmouseup = MouseUnPress;

var browser = navigator.appName;
var ver = parseInt(navigator.appVersion);

if (browser != "Microsoft Internet Explorer")
{
document.captureEvents(Event.MOUSEDOWN | Event.MOUSEUP);
document.captureEvents(Event.MOUSEMOVE);
obj = document.getElementById('WIND');
}
else
{
document.onselectstart = checkEl;
document.ondragstart = checkEl;
obj = document.all.item('WIND');
}

function checkEl()
{
return false;
}

var pressflag = false;
var oldcursx, oldcursy;
var firstflag = true;
var flag = false;

function MouseEvent(ev)
{
windx = parseInt(obj.style.left);
windy = parseInt(obj.style.top);
cursx = (browser == "Microsoft Internet Explorer") ? event.clientX : ev.clientX;
cursy = (browser == "Microsoft Internet Explorer") ? event.clientY : ev.clientY;

if(firstflag)
{
oldcursx = cursx;
oldcursy = cursy;
firstflag = false;
}

if (flag) {
obj.style.left = windx + cursx - oldcursx;
obj.style.top = windy + cursy - oldcursy;
}
oldcursx = cursx;
oldcursy = cursy;
}

function MousePress()
{
if ( (cursx > windx+x) &&
(cursy > windy+y) &&
(cursx < windx+x+w) &&
(cursy < windy+y+h) )
{
obj.style.cursor = "move";
flag = true;
}
}

function MouseUnPress()
{
if (flag)
{
pressflag = flag = false;
obj.style.cursor = "auto";
}
}
</script>


Спустя 5 часов, 6 минут, 56 секунд (2.03.2007 - 00:12) kart написал(а):
Цитата(md5 @ 1.3.2007, 15:18) [snapback]14703[/snapback]

а тут на форуме, возле профиля есть "Помощник" wink.gif
протесть во всех браузерах, если оно - дерни =)

Под IE лагает. Если перетащить "помощника" в самый низ до упора, а потом отпустить педаль крысы, то это окошко привязывается к курсору и преследует его dry.gif ... чё-то меня сёдня весь день кто-то преследует... не к добру....

Спустя 9 часов, 40 минут, 13 секунд (2.03.2007 - 09:52) Timok написал(а):
прикольно... AlexBB, твой вариант работает как ты и сказал в IE, но если изменить !DOCTYPE на xhtml - сразу перестаёт работать....

уже перепробовал кучу вариантов, щас с лебедевским ковыряюсь...

Спустя 13 минут, 8 секунд (2.03.2007 - 10:05) AlexBB написал(а):
Да там с xhtml надо px добавить
width:200px; height:200px; left:120px; top:120px;
и вроде работает

Но вообще я говорю - скрипт древний. Когда писался ряда браузеров еще не было просто. Но если надо адаптировать можно ...

Спустя 6 минут, 13 секунд (2.03.2007 - 10:11) Timok написал(а):
Цитата
Да там с xhtml надо px добавить

угу, так работает

Блин я с этими events в js никак не могу разобраться. Половина примеров которые нахожу не работают вообще, половина - работают в отдельных браузерах... хня какая-то... Лебедевкий скрипт вроде ничего, но большой гад...
Быстрый ответ:

 Графические смайлики |  Показывать подпись
Здесь расположена полная версия этой страницы.
Invision Power Board © 2001-2024 Invision Power Services, Inc.