Hammer.js простейшая реализация drag and drop одного DIV?

Question

[Alexey]

Вопрос достаточно простой, на который я не нашел к сожалению ответа...
Необходима простейшая реализация перемещения одного DIV-a. Тоесть drag&drop но только с помощью Hammer.js.

есть div:
<div class="first"></div>

есть javascript:

var element = $('.first').get(0);        
var hammertime = new Hammer(element);
        hammertime.on('pan', function(e) {
            var tapX, tapY;
            tapX = e.center.x;
            tapY = e.center.y;

            this.style.left = tapX;
            this.style.top = tapY;
        });

jsfiddle.net/0fawast9

Answer 1

[Ярослав Астафьев]

Вы же подключаете jquery, почему не делаете это с помощью его?
jqueryui.com/draggable

ну и пример для хаммера
https://gist.github.com/jordangarcia/30d73b5bf8c48...

Comments

[Сергей Протько]

потому что draggable глючит с тач девайсами да и он ущербен. Это было модным когда браузеры не имели dragndrop api

[Ярослав Астафьев]

Сергей Протько: простейшая реализация, про планшеты ничего не сказано. Наши фронтендщики юзают кастомную штуку, которая занимает очень много строчек кода и слушает мильён событий. Но зачем это в бытовых целях?

[Alexey]

"но только с помощью Hammer.js." я не зря написал это. Есть определенное условие какую технологию использовать, draggable здесь не используется!

[Ярослав Астафьев]

azovl: уже отредактировал и добавил hammer реализацию

[Alexey]

Спасибо большое, сейчас посмотрю.

[Alexey]

( Этот пример использует версию 1.х она достаточно стара, и очень много во второй версии deprecated. Мы используем новую версию...

[Ярослав Астафьев]

azovl: https://cdn.rawgit.com/hammerjs/hammer.js/master/t...
ну вот у них на оф. сайте примеры есть. Плюс там не плохие jsDocs
Честно говоря никогда ими не пользовался, но документация у них обширная. Искать легко и просто.