JQuery UI - Получение одного элемента из дисплея: скрытый элемент при перетаскивании - PullRequest
3 голосов
/ 11 августа 2009

У меня есть группа элементов, которые находятся на элементе конвейера в другом элементе, для которого установлено переполнение: скрыто с помощью css. Как при перетаскивании получить элемент «out» из держателя, для которого переполнение имеет значение «скрытый»? Когда я перетаскиваю классифицированное изображение «item», оно перетаскивается только внутри держателя, когда я пытаюсь переместить его «за пределы» держателя, оно прячется и не выходит за пределы старого элемента держателя.

<div class="holder" style="overflow:hidden;">
     <div class="conveyor">
          <img src="image1.jpg" class="item" />
          <img src="image2.jpg" class="item" />
          <img src="image3.jpg" class="item" />
     </div>
</div>

<script>

     $('.item').draggable();

</script>

Я также пытался добавить недавно перемещенный элемент к родительскому элементу, но затем элемент не вернется обратно к моему владельцу .... пожалуйста, помогите!

пытался добавить элемент:

$('.item').draggable(
     helper:'clone';
     revert:'invalid',
     start:function(){
          $(this).parent().parent().append(this);
     }
)

Ответы [ 3 ]

2 голосов
/ 11 августа 2009

Нашел ответ здесь -> http://docs.jquery.com/UI/Draggable. Дааа ... это было несколько часов копания!

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

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

Спасибо за помощь!

1 голос
/ 11 июня 2012

Во-первых, спасибо Дэвиду. В моем случае мне пришлось добавить еще один вариант:

// Drag and Drop
$('.draggable').draggable({ 
    revert: true,
    appendTo: 'body',
    helper: 'clone'
});
0 голосов
/ 11 августа 2009

Получите ли вы что-нибудь из этого?

$('.item').draggable( {containment: 'window'} );

$('.item').draggable( {containment: 'document'} );
Добро пожаловать на сайт PullRequest, где вы можете задавать вопросы и получать ответы от других членов сообщества.
...