В качестве эксперимента я создал несколько элементов div и повернул их с помощью CSS3.

    .items { 
        position: absolute;
        cursor: pointer;
        background: #FFC400;
        -moz-box-shadow: 0px 0px 2px #E39900;
        -webkit-box-shadow: 1px 1px 2px #E39900; 
        box-shadow: 0px 0px 2px #E39900;
        -moz-border-radius: 2px; 
        -webkit-border-radius: 2px;
        border-radius: 2px;
    }

Затем я сделал их случайным образом и сделал их перетаскиваемыми через jQuery.

    $('.items').each(function() {
        $(this).css({
            top: (80 * Math.random()) + '%',
            left: (80 * Math.random()) + '%',
            width: (100 + 200 * Math.random()) + 'px',
            height: (10 + 10 * Math.random()) + 'px',
            '-moz-transform': 'rotate(' + (180 * Math.random()) + 'deg)',
            '-o-transform': 'rotate(' + (180 * Math.random()) + 'deg)',
            '-webkit-transform': 'rotate(' + (180 * Math.random()) + 'deg)',
        });
    });

    $('.items').draggable();

Перетаскивание работает, но я заметил внезапный скачок при перетаскивании div только в браузерах webkit, в то время как в Firefox все хорошо.

Если я удалюположение: абсолют стиль, «прыжки» еще хуже. Я подумал, что, возможно, есть разница в происхождении трансформации между webkit и gecko, но они по умолчанию находятся в центре элемента.

Я уже искал, но только получил результаты о полосах прокрутки или сортируемых списках.

Вот рабочая демонстрация моей проблемы. Попробуйте просмотреть его в Safari / Chrome и Firefox.http://jsbin.com/ucehu/

Это ошибка в webkit или как браузеры отображают webkit?