VPF::d&d on touch devices - Форум программистов

Evghenusi

Дата 24.11.2013, 20:06 (ссылка)

(нет голосов)

Загрузка ...

майский жук

Профиль
Группа: Участник
Сообщений: 506
Регистрация: 3.8.2006
Где: Молдова, Кишинёв

Репутация: 1
Всего: 15

Здравствуйте.
При повторном перемещении блока, он "отпрыгивает" в левый верхний угол.
Подскажите пожалуйста, в чём кроется ошибка?

Код


window.onload = function()
{
    var offset;
    var els = document.getElementById('draggable');
    
    els.addEventListener("touchstart", function(e)
    {
        var left = e.changedTouches[0].clientX+document.body.scrollLeft-(parseInt(this.style.left)|0);
        var top = e.changedTouches[0].clientY+document.body.scrollTop-(parseInt(this.style.top)|0);
        
        offset = {
            x: e.changedTouches[0].pageX - left,
            y: e.changedTouches[0].pageY - top
        };
    });

    els.addEventListener("touchmove", function(e)
    {
        e.preventDefault();
        this.style.cssText = 'top:'+(e.changedTouches[0].pageY - offset.y)+'px;'
                            +'left:'+(e.changedTouches[0].pageX - offset.x)+'px';
    });
}

http://jsfiddle.net/W9LpC/show

Это сообщение отредактировал(а) Evghenusi - 24.11.2013, 20:14

CruorVult

Дата 25.11.2013, 14:27 (ссылка)

(нет голосов)

Загрузка ...

Опытный

Профиль
Группа: Участник
Сообщений: 868
Регистрация: 24.9.2008
Где: г.Киев, Украина

Репутация: 13
Всего: 28

На touchstart нужно только единожды установить offset. А у тебя при повторном touchstart смещение устанавливается как текущее положение мышки, соответственно и разница будет 0.
http://jsfiddle.net/W9LpC/3/

Ну а вообще, можно инициализировать разницу в 0 сразу на window.onload

Код


var offset = {
                x: 0,
                y: 0
            };

Это сообщение отредактировал(а) CruorVult - 25.11.2013, 14:27

Evghenusi

Дата 25.11.2013, 15:05 (ссылка)

(нет голосов)

Загрузка ...

майский жук

Профиль
Группа: Участник
Сообщений: 506
Регистрация: 3.8.2006
Где: Молдова, Кишинёв

Репутация: 1
Всего: 15

CruorVult, я правильно понял, если объявить offset={x:0,y:0} , то функция на событие "touchstart" не нужна?

Добавлено через 1 минуту и 1 секунду

Цитата(CruorVult @ 25.11.2013, 14:27

)

А у тебя при повторном touchstart смещение устанавливается как текущее положение мышки

Вы правильно подметили, переписывалось с декстопного варианта)

Добавлено через 7 минут и 15 секунд
блин, так и offset не нужен получается.
Остаётся:

Код


window.onload = function()
{
    var els = document.getElementById('draggable');
    els.addEventListener("touchmove", function(e)
    {
        e.preventDefault();
        this.style.cssText = 'top:'+e.changedTouches[0].pageY+'px;'
                            +'left:'+e.changedTouches[0].pageX+'px';
    });
}

0 Пользователей читают эту тему (0 Гостей и 0 Скрытых Пользователей)
0 Пользователей:
« Предыдущая тема \| JavaScript: Общие вопросы \| Следующая тема »