CODEWITHSUNDEEP
jqueryjquery-uijquery-ui-sortable
hh54188
hh54188

Reputation: 15626

jQuery UI Sortable: dragged element disappears

I set the <div class="container"> .sortable(), and there are some elements in the container.

When I drag the inner element, intend to sort the element with the others, once the dragged one out the container, it can not be seen.

But when I drop it into place holder, it could be seen again. Online case is here.

Anyone have met the problem before? Or anyone can help me with the problem?

Thank you

Upvotes: 20

Views: 19704

Answers (4)

Vinay Sahni
Vinay Sahni

Reputation: 5053

the trick is to set helper to 'clone' and use a temporary swaplist for the drag.. modified version of your code here

$( ".selector" ).sortable({
    helper: "clone"
});

Upvotes: 10

Kirk Ross
Kirk Ross

Reputation: 7153

My dragged items were disappearing in a vertical list and I found that using overflow-y: hidden instead of overflow:hidden worked for me. i.e. only target the y axis.

Upvotes: 3

mu is too short
mu is too short

Reputation: 434606

Drop the overflow: hidden; on .container and it will work. The problem is that during the drag you're moving a child of .container outside of the .container element, you've told the browser to hide any overflow while you're forcing an overflow during the drag and the browser is doing what you told it to do.

General advice: leave overflow alone unless you know what it does and why you need to use it.

Upvotes: 14

TheVillageIdiot
TheVillageIdiot

Reputation: 40497

most probably the problem is due to this: .container{ margin:0 20px; position:absolute;top:0;height:100%;width:280px;overflow:hidden;}.

If you set overflow:auto it shows the wrapper div with scrollbar and you can view your portlet.

Upvotes: 2

Related Questions