Javascript-форум (https://javascript.ru/forum/)
-   Элементы интерфейса (https://javascript.ru/forum/dom-window/)
-   -   DragnDrop в FF, chrome и Safari (https://javascript.ru/forum/dom-window/9792-dragndrop-v-ff-chrome-i-safari.html)

ajon 06.06.2010 03:46

DragnDrop в FF, chrome и Safari
 
приношу извинения.
Видимо 4 дня сидения над одной функцией даром не проходят. через час после постинга смог понять где бага вылазила..

теперь вопрос всего лишь сводится к кроссбраузерному доставанию ширины и высоты объекта из файла css ... а по этому вопросу нагуглить труда не составляет..

PS снесите плиз тему.

Geddar 06.06.2010 08:50

ajon, думаю было бы не плохо поделиться найденым решением. Ведь для того форум и есть :)

ajon 06.06.2010 14:11

хорошо, согласен ;)
изначальная задача была - переносить объекты по заданной части экрана. Основным затыком стало то, что объект должен тормозиться у границы и не вылазить за неё. По поводу самого драг н дропа можно найти в интернете хорошие статьи, которые взять за шаблон, а вот с этим моментом оказалась проблема.

Для того чтобы перетаскивать элемент его нужно делать позиционированным относительно родителя, но чтобы оне не вылазил за границы долна быть проверка вида:
object.style.left = (maybe_left >= 0 && maybe_left<=(doska_width - object_width) - 2) ? maybe_left + 'px' : (maybe_left <= 0?'0px':(doska_width - object_width) - 2);

где maybe_left - потенциальное новое значение позиционирования
doska_width - ширина доски, по которой перетаскивается объект
object_width - ширина объекта
то, что вычетается циферками - это бордеры (не стал для них автомат настраивать)

Затык, о котором я даже и представить себе не мог и долгое время смотрел вообще в другую сторону - это определение ширины объекта, с условием, что она указана в css. Дело в том, что оказывается object.currentStyle.width прокатит только для Opera и IE, остальные браузеры наотказ не хотят такое кушать. Для других браузеров приходится делать window.getComputedStyle(object,null).width; Вот собственно и всё решение, к которому пришел ;)

универсальное решение:
if( doska.currentStyle ) 
	{
	var doska_width = doska.currentStyle.width;
	}
else if( window.getComputedStyle ) 
	{
	var doska_width = window.getComputedStyle(doska,null).width;
	}


ЗЫ. Если у кого-то стоит задача по разработке драг-н-дропа в переделах ограниченной зоны - отпишитесь - выложу полный код, благо я всего две недели кожу на JS и код у меня пока более чем читабельный для любого уровня кодинга)))

exec 06.06.2010 15:21

ajon, я решал эту задачу так:

Во время перетаскивания объекта каждый раз сравниваем текущий pageX/pageY, если он больше отпределённого числа, то просто не присваеваем top/left'-у элемента текущий pageX/pageY:

if (e.pageX < 510) el.style.marginLeft = e.pageX - 10;

Geddar 06.06.2010 15:27

exec, да, обычно так и решаеться и я так делал во флеше и даже паскале. Метод универсальный. Если меньше допустимого, анологично.

ajon 06.06.2010 21:18

exec, угумс, но у меня еще один ньанс стоял проблемой... у меня изначальное смещение не всегда равно top:0; left:0; поэтому пришлось извращаться(( Согласен, что Ваш вариант проще и если еще как-нить придётся с этим столкнуться - наверное так и сделаю, чтобы не выпендриваться ;)


Часовой пояс GMT +3, время: 00:41.