Проблема с перетаскиванием jQuery и переполнением [закрыта]

StackOverflow https://stackoverflow.com/questions/811037

  •  03-07-2019
  •  | 
  •  

Вопрос

У меня возникает нежелательный эффект, когда я перетаскиваю div из контейнера div, который установлен как переполнение:прокрутите.

Я нашел пример кого-то другого, у кого была проблема, но я не смог найти решение

Пример в корзине для вставки

Что происходит, так это то, что прокрутка просто увеличивается, я могу понять, почему это было бы желаемым поведением, если бы вы хотели перетащить в пункт назначения внутри прокручиваемого div, но я хочу иметь возможность вывести его за пределы видимости прокрутки.

Это было полезно?

Решение 3

Безусловно, стоит обратить внимание на документацию

http://docs.jquery.com/UI/Draggable#option-scroll

прокрутка

Тип: Логическое значение
По умолчанию: true
Если установлено значение true, контейнер автоматически прокручивается при перетаскивании.

Все, кто заходит сюда, извлеките урок из моей ошибки, RT(F)M!!!

Другие советы

У меня была аналогичная проблема с включением перетаскивания между двумя разделениями с автоматическим переполнением.С помощью предыдущих ответов я обнаружил, что эта комбинация работает для меня (Safari 5.0.3, jquery-1.4.4, jquery-ui-1.8.7):

appendTo: 'body',
containment: 'window',
scroll: false,
helper: 'clone'

Приложение к

Элемент, SelectorDefault:'родительский'

Элемент, переданный или выбранный параметром appendTo, будет использоваться в качестве контейнера перетаскиваемого помощника во время перетаскивания.По умолчанию вспомогательный элемент добавляется в тот же контейнер, что и перетаскиваемый.

Примеры кода Инициализируйте перетаскиваемый объект с помощью указанной опции appendTo.

$('.selector').draggable({ appendTo: 'body' });

Решение для клонирования работает, но имеет две проблемы.

Первый:клон добавляется к телу.В зависимости от вашего css, ваш элемент может менять стили, поскольку перед запуском он находится внутри другого элемента, а во время перетаскивания он будет находиться непосредственно на элементе body.

Второй:Иногда элемент ДОЛЖЕН переместиться, и клон позволяет объекту находиться там.

Итак, решением этой проблемы является:

$('.selector').draggable({
    helper: 'clone',
    start: function(){
        $(this).hide();             
    },
    stop: function(){
        $(this).show()
    }
});

Установка параметра прокрутки не предотвращает скрытие дочерних элементов в области переполнения.Я придумал обходной путь, который использует вспомогательную опцию.Зацени это:

http://pastebin.me/164f0a4073496563fe3179ddcec5fd6d

Также вот ссылка на другой мой пост:

перетаскиваемые элементы пользовательского интерфейса jquery, которые не "перетаскиваются" за пределы прокручиваемого div

Вы также можете указать, какие типы элементов вы не хотите включать.

<div class="draggable"> 
    <h2>This will drag the div</h2>
    <ul>
       <li>This won't drag the div</li>
    </ul>
</div>

Примените это свойство отмены, чтобы игнорировать событие в указанных дочерних элементах

$('.draggable').draggable({cancel : 'ul'});
Лицензировано под: CC-BY-SA с атрибуция
Не связан с StackOverflow
scroll top